Published on December 21, 2016 by Chrome
Want create site? Find Free WordPress Themes and plugins.

Using Webpack want to learn more about code splitting? Then check out this weeks Totally Tool Tips where Addy gives you his top tips and Matt, unhelpfully, questions it…..totes a webpack noob.

Links:
webpack Code Splitting: goo.gl/AHiBwn
webpack Code Splitting – Libraries: goo.gl/8QRh5N
PWAs with React.js: goo.gl/IX57NE

Watch more episodes of Totally Tooling Tips here: goo.gl/IoXka7?

Subscribe to the Chrome Developers channel at goo.gl/LLLNvf

Did you find apk for android? You can find new Free Android Games and apps.

Leave a Reply

14 Comments on "Code-splitting your way to better perf with Webpack in Totally Tooling Tips (S3, E15)"

Notify of
avatar

Brian Preis
Guest
Brian Preis
9 months 6 days ago

Is code-splitting the method of lazy-loading?

Noah Grant
Guest
Noah Grant
9 months 24 days ago

We recently implemented this very thing in the Sift Science console, and it's worked wonderfully! One last tip I would offer is to use github.com/soundcloud/chunk-manifest-webpack-plugin to keep your updated chunk hashes out of your entry file. Without this, when you update a chunk file, your entry file gets cache-busted as well because it has to know the updated chunk's new hash. I remember the speakers from Housing.com referencing this at Chrome Dev Summit this year.

Cory Maloy
Guest
Cory Maloy
10 months 2 days ago

I implemented code splitting on our enterprise app. We did it based by state, so each state has all the needed code per state and it gets lazy loaded when needed. Makes the app much more scalable, especially with single page applications (we use angular).

Jacob Johnson
Guest
Jacob Johnson
10 months 10 days ago

What does that skeletor sticker say?

Pascal Gula
Guest
Pascal Gula
10 months 25 days ago

Back to TTT, and shocked to see G is supporting React officially…

Jerry Liu
Guest
Jerry Liu
10 months 27 days ago

If you have multiple landing pages, and you don't want to calculate what their common chunks are, here is a simple POC on how to auto generate common chunks: github.com/liuyanghejerry/webpack-auto-index-demo

zakaria amine
Guest
zakaria amine
10 months 28 days ago

GWT framewok introduced code splitting long time ago ( Gmail was partly written in GWT)

Aabhas Arora
Guest
Aabhas Arora
10 months 28 days ago

Exactly what I needed, thanks 🙂

Thiago Brito de Lima
Guest
Thiago Brito de Lima
10 months 28 days ago

CommensChunkPlugin – I thought it very interesting to get the router's path separated in entry object having different properties as shown: P1, P2, P3 and so on and so on. I still didn't know that plugin.

Colin Fox
Guest
Colin Fox
10 months 28 days ago

At 6:00, your bitly link says "wepback-precache" instead of "webpack-precache".

Google Chrome Developers
Guest
Google Chrome Developers
10 months 28 days ago

Thanks! Just fixed it up.

wpDiscuz