What’s new in JavaScript (Google I/O ’19)
Вставка
- Опубліковано 5 вер 2024
- This presentation gives an overview of cutting-edge JavaScript development techniques to build modern web and Node.js apps. Discover which features to expect in Chrome and Node.js soon, how the V8 engine optimizes for them, and how to improve real-world performance and stability on the Web and in Node.js.
Speakers:
• Mathias Bynens / mathias
• Sathya Gunasekaran / _gsathya
More info:
• v8.dev/
• / v8js
Watch more #io19 here:
Web at Google I/O 2019 Playlist → goo.gle/io19web
Google I/O 2019 All Sessions Playlist → goo.gle/io19al...
Learn more on the I/O Website → google.com/io
Subscribe to the Chrome Developers Channel → goo.gle/Chrome...
Get started at → www.google.com...
T60250 event: Google I/O 2019; re_ty: Publish; fullname: Mathias Bynens, Sathya Gunasekaran;
private class fields 6:57
Regex matchAll 9:16
Numeric literals 10:19
BigInt formatting 11:50
flat & flatmap 13:23
fromEntries 15:28
Map to Object conversion 16:47
globalThis 19:18
Stable sort 20:00
Intl.RelativeTimeFormat 22:45
Intl.ListFormat 24:29
Intl.DateTimeFormat -> formatRange 26:32
Intl.Locale 27:10
Top-Level await 28:12
Promise.allSettled/Promise.any 31:13
WeakRef 32:30
you are a hero 🤖🤖
Thanks for your sacrifice
I'm grateful for taking your time.
Thnks for ur efforts bro
YOu sir are a god
My favorite talk of I/O. Also kudos to the subtitles team for accurate subtitles (love how they write Node.js every time speakers mention Node)
I took care of the subtitles :) I want this presentation to be as accessible as possible. Thanks for the kind words!
Your favourite teleprompt read, you mean?
So you two have really practiced this. Really async await.
Ha ha 😂
Hahaha im dyin best comment :D Loved the talk too
😂😂😂😂😂
It's their event loop 😂😂
Wherever you go there's an Indian ..Proud
That's true, specially for India.
I love how IE's compatibility is not even considered! 😂
Edge is adopting Chromium and V8, so it’ll soon support the same features that Chrome supports.
This is explicitly mentioned at 00:18.
@@mathiasbynens well, edge is not IE ...
@@finally_code It's not IE but it's clearly the sign the Microsoft is on board with the idea of developing/maintaining apps once (and not waste time on bloatware for legacy stuff) that should look/run the same everywhere.
because internet explorer is the worst browser u can have
@@mathiasbynens ...isnt there some joint effort to encourage apple too?
The Internationalization API looks cool.
Would be hilarious if they actually left it as " Iñtërnâtiônàlizætiøn " for everybody to type.
@@shfunky Don't give them ideas!
i love whats happenin to javascript. from better to even better.
Love these new features.
How about with chrome 85 now is better more than with Chrome 75 can using too?
Can we add native currying and placeholders, rather than improving "classes"?
that would be awesome but not sure how that would really work, JS is an imperative language
Currying is a pattern, it exists today, JS is a functional language with TCO
Vertie it’s multi paradigm. Imperative is only one part
If you want a curried function, you can just chain arrows, e.g. const product = x => y => x * y.
The only thing that is ugly is the call, requiring parentheses for every argument application.
I'm really looking forward to finalizers, right now there's no way to automatically dispose of wasm resources other than calling a manual dispose method
Would the garbage collection mentioned in the WebAssembly presentation be a solution to this problem?
This is awesome! Can't wait for Chrome 75
It's already out if you use the dev channel :)
Is there a way to reliably know if the current environment has a stable sort implementation?
An extremely slow polyfill? That way, customers running your sort will believe their device to be slow and upgrade to a more modern system which will (hopefully) ship with a stable sort.
Or, a browser flag would be nice, but we can't have those for every feature. For some reason.
Sort an array with elements [0..n-1] modulo 4 (for example). If the sort is stable, the array is partitioned into 4 parts, where each part has only increasing elements.
@@mathiasbynens Yes that's certainly true but that might also happen coincidentally even if the algorithm isn't generally stable. In the absence of anything more reliable I'll probably rely on something like this.
I'm Tamil and I feel proud of the Internalization API... Good Work Google
Bruh I was looking for this comment lol
I love Tamil alphabet it's pure art (I understand nothing though :) )
23:23 தமிழ் மொழி. glad to see my native language. new flatmap method quite good
Things move so fast and get more complicated, so have to learn all time to keep up and even then I always feel like I’m behind..
holy shiiiit.. weakref is gold
One of the thing I never understand is, even "flatMap" is a "conventional FP name"
match + all -> matchAll
find + index -> findIndex
map + flat -> flatMap
match to All
find the Index
flat the Map
The real FP name for flatMap is >>=
@@DavidBlanch0 you mean bind
Omfg, this will be so easy now!
new Promise( ... ).any( updateProgressbar ).all( processFinished )
That's not how the API works, though. Promise.any and Promise.all are static methods, not instance methods. Also, Promise.any should not be used to update progress bars, since it only gives you a signal once (not once for every promise). See our explainer at v8.dev/features/promise-combinators for more details.
General question ( 14:20 ) is .flatMap usually a .map().flat() in the functional world? I always had trouple wrapping my head arround rxjs selection of map operators for example.
Generally yes, you'd map over a "container" F with some function (T => F), which creates F, and "flattens" to F. Same overall outcome as flatten after a map, but their implementation is more efficient.
In that example (if we use TypeScript types), it's an Array flatMap'd over with some (number => Array) to get an Array, rather than Array.
map is one-to-one transformation, while flatMap is one-to-many transformation
What about jQuery? Do think we have to forget completely this script language to the native JavaScript. I believe the jQuery is the best way for those who have more difficulty with the native language JS. Your feedbacks are welcome.
Javascript Inventors: "Let's just make a basic thing, but no biggie, not like it will be more than a novelty"
10 years later: This video
10 years? Maybe more like 24.
@@recursiv I've been using it since 97. Definitely more than 10 years lol. Maybe he meant 10n.
25:49 Was that a freudian slip?
Pretty sure my websites don't ever show that, but maybe this is a new design trend I'm not yet aware of! :P
Allways top notch quality! kudos
Safari - the Internet Explorer of browsers
Internet Explorer IS a browser so your joke is wrongly made.
Zolbat , thanks for the laugh.
That sentence doesn’t make any sense...
Isn't internet explorer the internet explorer of browsers? Oh wait..
@@lucioinnocenzo2328 Woosh. The joke is that Internet explorer isn't even considered a browser, described by a microsoft engineer as a 'compatibility tool'
love this talk,where can i get the slides?
Intl.RelativeTimeFormat is just great
Those 6 dislikes are from PHP developers
2 more coming here to dislike the advancement of javascript, seriously, just turn to javascript already, php is no match against javascript.
@@tiancihe795 Rust *cough cough* , Node is cool tho.
Love node, but I love python as well, flask is pretty good. Just use whatever does the job
Ha ha ;)
@@Microphunktv-jb3kj Check Ryan Dahl new cool project Deno (Node? TypeScript + Rust) You'll love it!
Such an informative talk.. 👍
Thanks, TC39
Are the presentation slides available?
Cool, it is worth sharing.
If _ was already convention for private, why reinvent and make them use # instead. Seems backwards, since you'd only "hurt" anyone who went against convention and then force them to clean up their act, making code more maintainable.
Hash to me is a number/length of var, seems backwards to use it when we have the convention of _var for class members for a very long time.
On the other hand, using a new symbol which will make the engine throw a hard syntax error is better because that way you can maintain the convention for older libraries and can promote clean code with the new feature. Sure, hash is mostly used for numbers but mostly within US. Most other countries started using hash when it was used within the scope of a hashtag. Remember,JS is a language for everyone :) Although tbvfh I would prefer if they actually had field access reserved words a la private/protected/public, at least using a # is a way to both not throw everyone under a boat plus add a new feature in a nice way.
Because we cannot break backwards compatibility. Any code that relies on a property with a _ prefix being accessible would break if we turned them into private fields all of a sudden.
@@mathiasbynens rather then just add a flag that does strict enforcement or not or a flag to allow for # to be an alternative option. Most of us use underscore correctly already, having this addition without having to go back and changing code would be better than forcing users to change to hashes.
@@mathiasbynens It sounds like a Microsoft policy about "updating" their Windows and this is the reason why the Windows 10 now adopt Linux inside(WSL/2). IMO keeping this mindset - "do not break backwards compatibility" will be the main reason for many pitfalls in the future JavaScript.
I like the new LINQ like functionality in the promises
Does babel support this?)
Looks like they are favoring OOP > Functional
Stable sort! Can it be?! :-D
finally no need to write complex sorting functions anymore!
It would be nice to have private fields in constructor functions too.
I loved the globalTHis , it looks simple but it is painful to do it right
no, if you have a clear knowledge of the topics then it's very useful
Happy to see it in Tamil 🤩
Promise.allSettled will be really helpful.
We implemented something like Promise.allSettled before. We called it Promse.allMost 😂🤣
Object.fromEntries
I wonder how it compares to:
.reduce((acc, curr) => ({
...acc,
[curr[0]]: curr[1]
}), {})
The algorithm is subtly different from that, but in almost all cases the result would be equivalent. If you mean in terms of perf, at least in v8 the fromEntries implementation is written with Turbofan, not in the ES layer, and would typically be faster (and it does not initialize a new object and spread all previous properties on every iteration as in this reducer).
Yes, this is exactly the kind of implementation you’d have to come up with yourself, previously. With Object.fromEntries, you don’t have to worry about it anymore.
Semantically
Speed! Reduce is really slow.
Array with 1 000 entries
fromEntries: 1.267ms vs reduce: 6795.383ms
Array with 10 000 entries
fromEntries: 2.434ms vs reduce: 26033.711ms
this is sick
😍23.00 Tamil formatting displayed 💕🤝
I will expect that new APIs and new virtual parsing engine for universal byte code
WASM replaces byte code parsing. You send either minified JS or WASM to the browser.
Where is internet explorer?? :p
Lol or even edge.
Hope that Intl API would help me discard MomentJs soon.
The weak ref proposal doesn’t seem very clean.
JavaScript catching up with Java (private class member fields, underscore separators, BigInt)...
What about just use keyword private for private attributes? Why Invent new syntax
Adding keywords to a living language is not simple. People might have already been using "private" as their variable and function names. All that code will get effected.
The numeric separators were built-in into Python long ago.
Wow
What was wrong with the standard "private field"? Most people are used to this, writing in typescript (and every other language). "#field" makes no sense, and is unwieldy, especially if you wanted to quickly change the field scope. Additionally, this can't nicely be extended for other field scopes such as protected -- unless they were to introduce more arbitrary field prefixes, i.e. "$field" for protected.
Looks ugly and reminds python comment.
100% this!!!
Without a doubt the # is the wrong approach to this. It's not like we have dozens of languages to learn from...but it is so easy to think of all the problems with this (besides the fact that other languages has already solved syntax/grammar for access modifiers)
What's wrong with what you propose is that you could just try and do: myObject.field = 123... and get an error, thus knowing of the internal implementation of that class.
#field is actually private, nobody has to know about it.
If any consumer of your class wants to add its own data to it, it can do whatever it wants, as long as it respects the documented API, with no fear of breaking obscure internal blackboxed infrastructure. Also, you get to change your implementation of that class and publish new minor versions with no risk of breaking the code of all your users...
React, for instance, is having tremendous troubles with their users **relying on** and **directly manipulating** a state property that was always meant to be **private**. They cannot change their implementation anymore from fear of breaking all their dependents.
Hell Yeah!!!
10:40 available only >= 75 version of Chromium if some interested in
28:28 it looks like Coffeescript, yeah ;{ a long time ago, again...
Nice features.. and Tamil 💐..
35:45 print and tape on wall
They sound lile they switch each others voice at first😂
😂😂😂
Linux and google love node.js
Promise.allSettled is awesome. I used to write lot of code for this.
json support bigint ?
Good question. I would be annoying to have bigInt data break over API requests (for example)
Just wrap it around quotes if json doesn't support it.
How bout some operators for piping or functional composition?
I'm waiting for async in forloop like in the new c#🤨
JavaScript already supports async iteration through for-await-of!
Actually, it does! :-)
Thusly: for( let i = 0; i < 10; i++ ) { await SomeAsyncFunction( i ); }
Await Promise.all(array.map((value) =>
asyncCall(value))
)
If you don't await in the map, the entire loop will run simultaneously and return an array of resolved promises in order
Did he say தமிழ்? DID HE JUST SAY தமிழ்? 👏👏
easy tiger! /joke
6:44 encapsulation like in Python
Thanks for Promise.allSettled()
Wow... updated node! Wait, what? Python already has many of these new features? Ah...
Private class fields and global this
yay numeric separators like ruby!
Safari is the new IE 😂
Safari mobile still not supporting Media Source Extensions API or Full Screen API.
I don't even go out of my way to cater to it. If Apple can't be bothered to keep pace with everyone else, I can't be bothered to slow down for them.
Ms Edge: am I joke to you?
See 00:18. Edge is adopting Chromium and V8, so it’ll soon support the same features that Chrome supports.
Finalizers are cool, but I really just want some straight-forward garbage collection control in JS. >:-|
@ 8:03 is it fine not to use constructor in parent class?
In this example, we need the constructor in the `Animal` class, since we want to assign the value passed to the constructor to the `name` field.
Imo, it's actually really unfortunate private class fields were implemented. Now there will be some cases where you can't inspect the content of objects used by some other websites, which seems like both a security hazard and also just bad manners imo... Anyway, what was the problem with using _ to dictate private variables? Finally what's with the screwed up syntax? idk... Not happy about this feature personally.
`for( const match of string.matchAll())` - shouldn't that be `let` instead of const because the value of this variable is being reassigned?
The 'match' is not beign assigned in case of an iteration match is the current value.
A new block scope is created for every iteration: medium.com/@mautayro/es6-variable-declaration-for-loops-why-const-works-in-a-for-in-loop-but-not-in-a-normal-a200cc5467c2
`match` is not being re-assigned within the loop body or its condition, so it can be `const`. The code example is correct.
cool
❤️❤️
# is by convention a comment ... also javascript is famous for being a classless language everything is an object, what happens with the prototype?
Year 2019: JavaScript discovers monads exist
just become typescript already please
Lee Owen 😂😂😂😂😂😂
bigNumber pls?
What about Edge (not shown in browser support slides)?
Edge is soon going to be Chromium-based, so it’s the same as Chrome (and Opera etc.). It’s one of the first things we mention: 00:18
hi
It's funny how they don't mention Edge like it' non-existent LOL
On the contrary, it’s one of the first things we mention: 00:18
@@mathiasbynens sorry, my bad
They don't mention it because it will use Chromium very soon so it will support everything Chrome does.
God that hash private field class annotation is ugly. Why could they not just use typescripts implementation? Just add private in the front of it
Freinds
God Blees
Ysa Mdn
This comment is just for fun... for all others, polyfill is available... ;-)
They could have done anything to make JS better and they thought private fields is what we need? The getter/setter craze amazes me.
Thanks for all the great JS applications on desktop. (Huge amount of sarcasm incoming)
JS is practically that what we don't need currently as it try's to make software more generic so it runs on any hardware but we actually need software that is build for hardware.
STOP STICKING NEW IN FRONT OF APIS
I wished nothing was new. JS gets increasingly like a junk heap like C#. What we need is less syntax. The only features they needed to get done are multi-threaded Array.prototype.map, Array-comprehensions, some kind of pattern-matching. Everything else is just for developers who only understand superficial things like syntax, but no semantics.
If you intended to mean "array comprehension" the same as python's list comprehension, please stop, list comprehensions in python make code very unreadable because they are usually too long, you can always you Arra.prototype.map to emulate simple list comprehensions in python
I want to be Professional React developer.
Class is messing
Funny to see that they completly ignore Microsoft Edge but scarry that I need to support it :D
Edge is now built on top of Chromium. It's not on the list because it already follow the development cycle now and all the features will be available to it
We didn’t ignore Edge at all. In fact, Edge soon being based on Chromium is one of the first things we mention: 00:18
@@mathiasbynens Yeah, that's correct when we are talking about the future but the current state may differ and it will take a lot of time until an industry has migrated from Edge/IE to Edge (V8) that's the state we have to handle right now and in foreseeable future. But anyway the message is clear and keep up the great work!
there is no point to invent tons of workarounds to speedup garbage collector, it's better to have a language having no such garbage collector
Compile your GC-free language to WebAssembly.
82 DISLIKES FROM IE
It's a pity that so ugly language as JS, is getting popular everywhere and have the support of corporations.
Many other languages much easier, much better, have already all these features, with not so ugly syntax and weird parts.
What is the ugly part you are talking about?
"getting popular"?!! JavaScript runs on 6 billion connected PCs and phones allowing universal zero-install software. Nothing else does, or is likely to. It's tricky to upgrade an ubiquitous language, I think TC39 is doing a fine job with all its constraints.