Webpack 延迟加载在 Rails 上并支持 CDN

  • Webpack is the best module bundler: Reduced an app's JS footprint from 906KB to 87KB for mobile visitors. Its core is to allow require('./foo') for JavaScripts, replacing the mess of <script> tags.
  • Comparison with other bundlers: RequireJS with AMD was clunky and not widely used. Browserify was better with CommonJS syntax in the browser but setup was complex and slow. Webpack is fast, compiling a huge codebase in less than a second.
  • Lazy loading code: Can perform minimal bundle coverage and lazy load code. Users only download necessary code. Easy in theory with require.ensure, but in production, head calls to a Heroku Rails app were slower than to Amazon's CloudFlare.
  • Lazy loading with CDN support: To use with Rails, follow Justin Gordon's guide. Configure Webpack in webpack.rails.config.js, add a startup call, and modify application.js. Change output settings to use CDN with fingerprinting for caching. A simple fix is to copy the file in the assets.rake task.
  • Benefits: Reduces JavaScript loading for mobile users. Makes code easier to deal with by allowing require of needed code instead of putting everything in a global object.
阅读 4
0 条评论