lingow / twchrome

MIT License
0 stars 0 forks source link

Split or lazy load dependencies in popup.js #22

Open lingow opened 3 years ago

lingow commented 3 years ago

The module has grown a lot, and there's a warning every time that it is built:

$ npm run build                                                                                                               

> twchrome@0.1.0 build /home/lingow/projects/twchrome                                                                         
> webpack                                                                                                                     

Hash: 03fd1a4fabcdfbbf20de                                                                                                    
Version: webpack 4.44.1                                                                                                       
Time: 3439ms                                                                                                                  
Built at: 09/05/2020 12:12:29 PM                                                                                              
               Asset      Size  Chunks                    Chunk Names                                                         
background/bundle.js  3.54 KiB       0  [emitted]         background                                                          
   options/bundle.js   171 KiB       1  [emitted]         options                                                             
     popup/bundle.js   266 KiB       2  [emitted]  [big]  popup                                                               
Entrypoint background = background/bundle.js                                                                                  
Entrypoint options = options/bundle.js                                                                                        
Entrypoint popup [big] = popup/bundle.js                                                                                      
[10] ./src/sync.ts 3.83 KiB {0} {1} {2} [built]                                                                               
[22] (webpack)/buildin/global.js 472 bytes {1} {2} [built]                                                                    
[28] ./src/background.ts 1.99 KiB {0} [built]                                                                                 
[29] ./src/options.ts 1.08 KiB {1} [built]                                                                                    
[30] ./src/popup.ts 18.1 KiB {2} [built]                                                                                      
[31] ./src/description.ts 652 bytes {2} [built]                                                                               
[32] ./src/description.pegjs 62.3 KiB {2} [built]                                                                             
    + 82 hidden modules                                                                                                       

WARNING in asset size limit: The following asset(s) exceed the recommended size limit (244 KiB).                              
This can impact web performance.                                                                                              
Assets:                                                                                                                       
  popup/bundle.js (266 KiB)                                                                                                   

WARNING in entrypoint size limit: The following entrypoint(s) combined asset size exceeds the recommended limit (244 KiB). Thi
s can impact web performance.                                                                                                 
Entrypoints:                                                                                                                  
  popup (266 KiB)                                                                                                             
      popup/bundle.js                                                                                                         

WARNING in webpack performance recommendations:                                                                               
You can limit the size of your bundles by using import() or require.ensure to lazy load some parts of your application.       
For more info visit https://webpack.js.org/guides/code-splitting/                                                             
lingow commented 3 years ago

I have been thinking about using svelte to componentize the ui. This would imply a major refactoring, but will solve this issue for good.