Transitioning to modern JavaScript

Over 90% of web traffic comes from browsers that support modern JavaScript, yet most websites ship legacy syntax in order to support a small number of very old browsers.

We now have the ability to deliver modern and legacy code to browsers based on what they support, but this doesn't extend to the large amount of dependency code in our applications. Our dependencies are still published as verbose legacy syntax in order to support the lowest common denominator of browsers today.

This talk explains how legacy dependency code is one of the biggest performance problems on the web today, and what steps we can all take address it.

Resources:

Speakers: Houssein Djirdeh, Jason Miller

#chromedevsummit #chrome #javascript

event: Chrome Dev Summit 2020; re_ty: Publish; product: Chrome - General; fullname: Jason Miller;

[milanlucansky]

Nice! This video can be also called "The cost of IE11!"

I've found generators to be most useful when writing code for Node; in cases where you are slowly going trough a big dataset that mutates during the operation.

[dyssus]

That was super interesting, would love to see more videos like this

[kolavithonduraski]

you are a very good team. good presentation, good talk.

nice job guys! Thanks !👍

[megabyte]

Thank you for this explanation of the benefits of transitioning from es5 to 'modern javascript'. I think I understand why one of my projects ran slower than expected in a certain edge case. I set the target to es5 and it used the transpiled polyfills instead of the modern code.

[georgekrax]

Great talk! Really liked the way you explained things and provided useful and easy solutions

[MobiusCoin]

The ONE time I had to use a generator was to do the thing in the example 😅

[ddrweb_]

What about the bandwidth consumption that this video is generating, how many trees did you plant?

[TesterAnimal]

Lucky to be able to.

I just finished clearing our codebase of IE workarounds and polyfills today.

[vikramadityakukreja]

This was a well presented session. Thanks folks!

[alleung]

Now that Google controls the entire browser market share (Mozilla being killed, Edge & Brave running on Chromium), what's stopping the browser from supporting all the necessary APIs to bring gRPC to browsers natively (ditch the need for gRPC-Web proxies)? The W3C not cooperating?

[hnasr]

Its really weird to hear my name on Google Chrome dev haha
Houssein great content and awesome name dude!

[levelsofself]

Really great talk, very informative thanks guy. Well, looks like estimator dev got pulled offline real quick though 😢

[jadedtheredone]

Did anyone create a webpack configuration, referencing the last scheme, building both modern and legacy bundles?

[shubitoxX]

What about the CSS part? Shipping modern vs legacy CSS?

[nivo]

Modern for-loops suffer from low performance. The same is true for mixins vs classes. If we want people to adopt new features, we should provide better "runtime-performance" as well. Size != Runtime performance.

[emrm]

Love the video guys. Very descriptive and super advanced.

[NarayanaTheUltimate]

Where do I learn this => when I learned javascript years back it wasn't there?

[kathrinayer]

Is there a link to the data for the carbon cost of old javascript?

[tptyuvi]

This is really useful 👌 and we will start implementing these modern tranpile which is into ES2017