Today I wondered about an issue in the import order of components, be it Angular, React, or Vue.
Does order of import of order-of-use components improve performance or nothing to see? Where everything is already built and js will only be responsible for displaying the content.
React makes no difference to the import order. There is a VSCode extension called "Import Cost" that shows the weight (size) of your import so you can analyze whether you should import everything from that component or just what you are going to use.
When you simply use require , the webpack compiles all your modules into a single javascript file, and according to the module size (+ dependencies) this file will be large. So if it is a web application and the user is on a slow internet logically the application should take a while to start for the first time.
To solve this the webpack has the Code Spitting feature ( link ) where when you use the function import() it splits its modules into small files that are loaded only when needed. This way your build gets smaller, so your application starts faster.
For Vue.js there are Dynamic and Asynchronous Components ( link ) .
