The State of JavaScript - The State of the Web

[@dibaliba]

Addy is my web development guru.

[@mepizzasmangled]

Don't stop making these!

[@russellhuq6929]

Thank you, Rick and Addy!

[@ThadHumphries]

Greedy ads and too many ads drive users to AdBlock and Ghostery.

[@mitchelldunaway]

Closed Captions: 10:10 - "time to get interactive" / 10:25 - yes, it's Travis CI / 10:26 - "in the pull request"

[@elliemay1748]

A lot of this is due to business requirements, I.E. the trend to have the frontend completely separate from the backend so that the backend is just API, so that the same API can be deployed cross platform. That led to the rise of things like React, which require twice as much code to do the same thing just because people went "Oh cool look how fast it renders! We must build everything in React now!", and enforces all these insane rules about one way data binding for the sake of the all mighty "convention". Then usually about 30-40 libraries on top of that to get you out of the hole that React creates. The issue is not momentJS lol. But what can you do? Most businesses are way to strapped for cash and time to be worried about optimizing to that level. If you're worried about minimizing your JS code base because it's over 1mb, it's either because there is some sort of technical limitation you're hitting due to it, or you're somehow completely out of other much more critical issues, which has never happened anywhere I've worked in 15 years.

[@eni4ever]

Look at that T-Shirt. I think he's a FF spy! 🦊

[@philipgomez713]

I saw that too! funny

[@codewithnacho]

Hahahaha Saw the same thing

[@rowolta]

One of the biggest problems is that developers are too keen on importing external libraries. Keep it simple folks.

[@alexhinds7848]

Best practice for external libraries that support it is single file functions, as with lodash, date-fns etc. Allows developers to get tiny additional payload and only the barebones functionality they require of a piece of the library.

[@arbaazkhan7091]

is it only me or this host guy looks and sound like Will Wheaton?

[@CerebroVasconcelos]

It's really

[@herrbasan]

In the age of bloated frameworks most of what he's saying is lost on most people. The odd fact is that i have to defend my way of doing it (creating my own tooling for the task at hand) because JS Frameworks are seen as "Best Practice", which is insane to me. I usually get the same results with 1/10 of code that runs twice as fast in half the time.

[@cloudstrife7083]

that's because "most" (not saying all) JS programmer aren't good programmer like senior C/C++ programmer.... they don't have deep knowledge of performance and OO etc The JS community is mostly made of kids who didn't start programming in the "hard language" back in the 90's or early 2000's so they went online and just started to scripts without optimization or data structure... so you see the mess we are in today with bloated stuffs all over the place that your talking about and the re-inventing the wheel everywhere

[@kamaboko1]

And there aren't any bad C/C++ programmers.

[@herrbasan]

I completely fine with the concept of abstraction layers to simplify development for a certain task or a certain group of people. Javascript itself is such an abstraction layer. But those should always reduce complexity, not add to it. There is people a lot smarter then me making this point. I don't claim to be expert in anything. I just know that i'm a lot more efficient and i'm almost certain it is not because i'm the better programmer. I think there is a paradigm problem with web-development.

[@kamaboko1]

@@tureebluh I think it really depends on where you work and what kinds of projects they have you working on. For instance, if you have to update a website that uses jQuery, what are you going to say to your boss? "I'm not going to use jQuery. Forget that." I don't think so. Now granted, it is certainly not my first choice. But if it drops on your plate you have to deal with it. As for bootstrap, I will use it for rapid prototyping using React. I can spend more time on React and less time on the HTML and CSS, and in my estimation in that situation it is a better use of time.

[@Bulbophile]

Hope to get there

[@TheUnknownFactor]

One thing I really dislike about these types of things, and other content google puts out recently, is stuff like "promises are well supported for a few years now"; yeah, if you're talking about evergreen. Almost all actual web-developers still need to support IE11. I mean sure, it'd be better to only include those polyfills on IE11, but this whole pretense that IE11 doesn't exist or doesn't still typically need to be supported is absurd.

[@AddyOsmani]

There are absolutely sites that will need to continue support IE11 and other non-evergreen browsers. What we try to encourage (and I didn't have time to capture with nuance) is that this can be done with some balance. For example, conditionally serving polyfills for features like Promises to browsers that need them. This has become more straight-forward with babel's preset-env and browserlist. In some of our projects we'll generate a legacy.js bundle for IE11 while serving everyone else a leaner bundle. Best of both worlds?

[@slidewineder3953]

fantastic production

[@lsping8]

There is framework out there that support code splitting out of the box, it's call Next.js (it's a react.js isomorphic framework)

[@SudoProgrammer]

So much valuable information at one place❤..keep doing👏

[@Bulbophile]

Exceptions prove rules in languages. A ratio that makes a language a language. There are more exceptions to the rules in JavaScript than what are needed to make it a language.

[@acollierr17]

This was great!

[@AungBaw]

Addy's design pattern book is epic

[@codetechy]

What is the name of that book? Plz

[@AungBaw]

@@codetechy addyosmani.com/resources/essentialjsdesignpatterns/book/index.html

[@ps49556n]

ad networks and other 3rd party scripts that deal with user data are BY FAR the biggest problem with web performance and destroy the user experience. I wish this topic was discussed more in public mediums such as twitter, etc. Chrome has been THE leader in advancing browser features and security and I hope they consider '3rd party scripts' as an important problem.

[@nixtoshi]

A lot more bandwidth is lost to images, SVGs and audio files. I think optimization and the recommendations are important, but UX is more important at the end of the day. Because most users will be able to load 1mb in less than 5 seconds, in return they get a nicer UX

[@619frank]

wait is that the guy who used to have long hair

[@LJdaentertainer]

Yes

[@mcbernnard4303]

JS is like foxpro?

[@h3rteby]

"Promises have been well supported for a number of years" According to Google Analytics, 25% of our users are still on Internet Explorer :( Even on Windows 10, Internet Explorer beats Edge...

[@samuelgrahame3617]

Well if someone needs that much js. It's fine if you are making a business application. Where you treat the entire js is the application.

[@sudarshangurung]

Is that a fox without a fire?

[@samuelgrahame3617]

Why not just let the programmer export the code that is not used. From Google dev console.

[@mandaputtra]

I wanna test your browser tooo, give me a link

[@alkayes247]

Google Chrome

[@HoracioMiguelGomez]

Of all the T-Shirts in the world you woke up, remembered you had a Chrome interview and put on a Firefox 🦊 one?

[@addyosmani1056]

This is a teejungle.net shirt rather than a Firefox one :)

[@carloalberto4132]

Javascript has made the web a playground for hackers.

[@themorbidhero2987]

Why would you say that

[@callofdutymuhammad]

@@themorbidhero2987 Passive downloads of third party software all the time?

[@apidas]

there's no too much javascript

[@rickviscomi9810]

False

[@ferns2077]

!true

[@lordswaggity1213]

Go do your homework.

[@vic6466]

Firefox t-shirt

[@lawfreed]

well played.

[@patrickcyiza595]

It's hard to believe that the same company saying this is backing up angular.... Just saying.

[@erobwen]

There can not be too much of Javascript!

[@lordswaggity1213]

Go do your homework.

Oh that fox.

[@StefKrie]

It's Firefox!

[@harogaston]

He knows better!

[@dandan7884]

ELM anyone? In the last benchmark I've seen building a whole app using ELM consumed less bytes than the React framework.

[@mandaputtra]

I used AppRun it super Blatzzz, but lack of documentation

[@mithunkumar-hs6ni]

i am a java developer, To me javascript developers looks like scientists

[@themorbidhero2987]

Why?

[@mithunkumar-hs6ni]

i feel Javascript is difficult to learn.

[@aArcziMetin2]

@@mithunkumar-hs6ni you would learn it in 10 min tbh

[@mithunkumar-hs6ni]

two months passed, i am still learning.

[@mithunkumar-hs6ni]

i agree

[@sergioavila2720]

Javascript with Django.

[@kevindt100]

1 MB ummm my site has like 7 When i send yay i think

[@sukhsingh7057]

Feel sorry for the person who need to support IE8

[@resuuser6124]

Any IE fans here? :D

[@johnbecker3116]

WASM!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!

[@samuelgrahame3617]

WASM does not have access to the dom. So WASM is only good for heavy algorithms

[@adilismail3593]

Hey google ur chrommy is very resource hungry on Linux

[@A1rPun]

Go FF or chrommyum

[@IdrisMC]

This is why i stopped using bootstrap and jQuery. I just use backend libs and framework s

Webpack is the root of evil #dontpack

[@aArcziMetin2]

Wrong

[@KevinBeal]

Not enough black women

[@rickviscomi9810]

I care a lot about representation on this show. Feel free to suggest the names of guests you'd like to see and I'll reach out to them!

[@habibsspirit]

+Rick Viscomi He was very likely mocking the diversity agenda big companies have nowadays.

[@md.fazlulkarim8847]

I don't like the idea of showing a skeleton version(without JS) of websites in 2g networks. Always remember, you are just a browser, a utility, like a pair of glass. We see the web through the glasses. You have no right to alter the actual view without the consent of site owners... Anyway I enjoyed the talk. 🧡

[@jaycassar8027]

First