I started testing different ideas and there were mainly three things that had a large impact: 1. Moving from React to Preact (+10 points) 2. Carefully optimizing the chunks emitted by Webpack (+15 points) 3. Removing the ads on our landing pages on mobile devices (+15 points)
-
Show this thread
-
Replying to @PeterssonJesper @dan_abramov and
Was this before or after Next 9.2?
1 reply 0 retweets 1 like -
-
Replying to @PeterssonJesper @dan_abramov and
What did carefully optimizing entail? Just getting rid of excessive dependencies?
1 reply 0 retweets 0 likes -
Replying to @timneutkens @dan_abramov and
Nope. Except from switching to Preact, but that is a bit of a different story. Apart from what’s required to run Next we don’t have any 3P dependencies included in our bundles for our perf-critical pages (our landing pages).
1 reply 0 retweets 1 like -
Replying to @PeterssonJesper @timneutkens and
What I did was just to tune webpack to get the right things into the right chunks. For instance, our CSS (which is like 30kb for the entire site) got spread into 6 different chunks on just the start page. I also found polyfills duplicated in _app.js and in page-specific chunks
1 reply 0 retweets 2 likes -
Replying to @PeterssonJesper @timneutkens and
Which solution did you end up using for dropping in Preact? There are a few floating around and some of them end up putting Preact into its own bundle, which is not good for performance. This was my effort to demonstrate the correct config:https://github.com/developit/nextjs-preact-demo …
1 reply 0 retweets 8 likes -
Replying to @_developit @timneutkens and
I probably took the path of least resistance. I’m currently bundling preact, preact/compat and the polyfills from Next together. Will checkout your example though! I’m sure what I did can be improved.
1 reply 0 retweets 0 likes -
Replying to @PeterssonJesper @timneutkens and
As long as they aren't ending up in their own bundle or in the route bundles that's probably okay. The polyfills seems like a drawback though, Next 9.2 outputs a `polyfills.legacy.js` bundle that is conditionally loaded only in older browsers. Combining that will always load it.
1 reply 0 retweets 2 likes -
Replying to @_developit @PeterssonJesper and
And 9.3 will drop core-js from all bundles
1 reply 0 retweets 12 likes
Oh thank hades!

-
-
Replying to @slightlylate @_developit and
PR: https://github.com/zeit/next.js/pull/10212 … Only loads the polyfills on nomodule browsers
We saw even bigger wins than outlined in the app in many real-world applications. Eg I saw one yesterday that dropped 30kB instead of 12.1 reply 1 retweet 24 likes -
New conversation -
Loading seems to be taking a while.
Twitter may be over capacity or experiencing a momentary hiccup. Try again or visit Twitter Status for more information.
& Web Standards TL; Blink API OWNER
Named PWAs w/
DMs open. Tweets my own; press@google.com for official comms.
