Download to read offline
![const Foo(y) = x; // instance-array destructuring
const Foo([y]) = x; // nested array destructuring
const Foo({y}) = x; // nested object destructuring
const [Foo(y)] = x; // nesting
const { z: Foo(y) } = x; // ..
const Foo(Bar(y)) = x; // ..
const X.Foo(y) = x; // qualified names (i.e., a.b.c)
Foo(y) = x; // instance-array destructuring
Foo([y]) = x; // nestedarray destructuring
Foo({y}) = x; // nested object destructuring
[Foo(y)] = x; // nesting
({ z: Foo(y) } = x); // ..
Foo(Bar(y)) = x; // ..
X.Foo(y) = x; // qualified names (i.e., a.b.c)](https://image.slidesharecdn.com/fosdem25howisjavascript-250311163741-28d6e785/85/Nobody-asks-How-is-JavaScript-34-320.jpg)
![const shadowRealm = new ShadowRealm();
// pluginFramework and pluginScript become available in the ShadowRealm
const [ init, ready ] = await Promise.all([
shadowRealm.importValue('./pluginFramework.js', 'init'),
shadowRealm.importValue('./pluginScript.js', 'ready'),
]);
// The Plugin Script will execute within the ShadowRealm
init(ready);](https://image.slidesharecdn.com/fosdem25howisjavascript-250311163741-28d6e785/85/Nobody-asks-How-is-JavaScript-42-320.jpg)
![1e20 + 0.1 + -1e20 === 0
Math.sumPrecise([1e20, 0.1, -1e20]) === 0.1](https://image.slidesharecdn.com/fosdem25howisjavascript-250311163741-28d6e785/85/Nobody-asks-How-is-JavaScript-44-320.jpg)
![function bound(value, { name, addInitializer }) {
addInitializer(function () {
this[name] = this[name].bind(this);
});
}
class C {
message = "hello!";
@bound
m() {
console.log(this.message);
}
}
let { m } = new C();
m(); // hello!](https://image.slidesharecdn.com/fosdem25howisjavascript-250311163741-28d6e785/85/Nobody-asks-How-is-JavaScript-52-320.jpg)
![let odds = new Set([1, 3, 5, 7, 9, 11, 13]);
let primes = new Set([2, 3, 5, 7, 11, 13]);
let oddPrimes = primes.intersection(odds);
// Set { 3, 5, 7, 11, 13 }
let evenPrimes = primes.difference(odds);
// Set { 2 }](https://image.slidesharecdn.com/fosdem25howisjavascript-250311163741-28d6e785/85/Nobody-asks-How-is-JavaScript-57-320.jpg)
Uploaded byIgalia
Nobody asks "How is JavaScript?"
From frontend developers to data scientists; from hobbyists to researchers, the JavaScript programming language offers something to everyone. Still, while everybody asks "what is JavaScript?" nobody asks "how is JavaScript?". It might therefore be interesting to dig a bit deeper into this complex and versatile programming language: Where is it going? How has it evolved over the years? How does language design and evolution happen in the first place? What are the rules put in place to ensure that it evolves in the right direction and continue to serve its ever-evolving set of users and other stakeholders? Join me in this overview of the TC39 standards committee, its processes and initiatives as we learn just how much work goes into reshaping the most popular programming language for the future. (c) FOSDEM 2025 1 & 2 February 2025 https://fosdem.org/2025/schedule/event/fosdem-2025-4276-nobody-asks-how-is-javascript-/
More Related Content
Similar to Nobody asks "How is JavaScript?"
Nobody asks "How is JavaScript?"
- 1.
- 2. About Me Ujjwal Sharma(ryzokuken) from New Delhi, India based out of A Coruña, Galiza OSS zealot, open web maximalist love dogs, (masochistic) videogames work at Igalia
- 3. About An open-source consultancy Aworker-owned cooperative Extensive work across major open source projects and ecosystems Linux kernel, userspace and multimedia Major contributor in the web platform and browser projects Compilers (JS engines, LLVM) and PL design (WASM, JS) @ryzokuken
- 4.
- 5. Everybody asks "What isJavaScript?" Nobody asks "How is JavaScript?" @ryzokuken
- 6. Did you knowthat JavaScript is standardized? @ryzokuken
- 7. What even isa Standards Body? 1 @ryzokuken
- 8. Do you remember🧀? @ryzokuken
- 9. They’re venues for unification& uniformization ● WHATWG ● W3C ● ISO ● ECMA ● Unicode ● … @ryzokuken
- 10. TC39 is the TechnicalCommittee that defines the JavaScript language @ryzokuken
- 11. Delegates ● Implementers (Apple,Google, Mozilla, Microsoft, …) ● Companies (Sony, Netflix, Bloomberg, …) ● Students and NPF (Universities, OpenJS F, …) Invited Experts ● Subject matter experts ● Community representatives Contributors, Editors, Reviewers & Community Who participates? @ryzokuken
- 12. Glossary … ❏ ECMA ❏Technical Committee (TC39 , TC53, TC55) ❏ TG2, TG3, TG4, TG5 ❏ ECMA-262 … ❏ ECMAScript @ryzokuken
- 13.
- 14. Consensus-based decisions Diverse setof people in the committee Implementers, Practitioners, Community Experts, Academics Objections and concerns to satisfy everyone No stakeholder has more power than others, concerns must be rational @ryzokuken
- 15. STAGES Steps where proposalevolves and receives feedback 4 stages of maturity ← more on this later! 😉 @ryzokuken
- 16. TASK GROUPS TC39 charterssub-groups to work on focus areas: 👷 TG1: The core ECMAScript specification 👷 TG2: Internationalisation 👷 TG3: Security 👷 TG4: Sourcemaps 🆕 👷 TG5: Research on Language Standardization 🆕 @ryzokuken
- 17.
- 18.
- 19. When 6 Plenary Meetingsa year Online or In person Focus Groups and Incubator Calls Monthly or Biweekly TG2 / Editors / Outreach / Proposals / Educators / Tools Monthly or Biweekly @ryzokuken
- 20. The Process 3 Stage-by-stage 2.7& @ryzokuken
- 21. STAGE 0 💡 Strawperson Justan Idea Explainer, idea under discussion Oversimplified proposal
- 23. STAGE 1 Describe theshape of a solution it’s an idea under discussion Proposal �� Devote time and have a “Champion” Demos / Polyfills Major changes
- 24. STAGE 1 Signals Daniel Ehrenberg,Yehuda Katz, Jatin Ramanathan, Shay Lewis, Kristen Hewell Garrett, Dominic Gannaway, Preston Sego, Milo M, Rob Eisenberg
- 25. // A VanillaJSCounter let counter = 0; const setCounter = (value) => { counter = value; render(); }; const isEven = () => (counter & 1) == 0; const parity = () => isEven() ? "even" : "odd"; const render = () => element.innerText = parity(); // Simulate external updates to counter... setInterval(() => setCounter(counter + 1), 1000);
- 26. const counter =new Signal.State(0); const isEven = new Signal.Computed(() => (counter.get() & 1) == 0); const parity = new Signal.Computed(() => isEven.get() ? "even" : "odd");
- 27. STAGE 1 Decimal Jesse Alama,Andrew Paprocki
- 28. 0.1 + 0.2=== 0.3
- 29. Sync Imports Pattern Matching Stabilize TypeAnnotations STAGE 1 🧐 Iterator Unique Object pick/omit ...and around 80 others
- 30. STAGE 2 Draft�� Describe syntactic and semantic details Form spec language - Initial Spec Text Semantics and API are covered - not completed TC39 Expects that feature would be developed in future Experimental
- 31. STAGE 2 Async Context AndreuBotella, Chengzhong Wu, Justin Ridgewell
- 32. const asyncVar =new AsyncContext.Variable(); let snapshot asyncVar.run("A", () => { snapshot = new AsyncContext.Snapshot(); });
- 33.
- 34. const Foo(y) =x; // instance-array destructuring const Foo([y]) = x; // nested array destructuring const Foo({y}) = x; // nested object destructuring const [Foo(y)] = x; // nesting const { z: Foo(y) } = x; // .. const Foo(Bar(y)) = x; // .. const X.Foo(y) = x; // qualified names (i.e., a.b.c) Foo(y) = x; // instance-array destructuring Foo([y]) = x; // nestedarray destructuring Foo({y}) = x; // nested object destructuring [Foo(y)] = x; // nesting ({ z: Foo(y) } = x); // .. Foo(Bar(y)) = x; // .. X.Foo(y) = x; // qualified names (i.e., a.b.c)
- 35. After Stage 2comes... Stage 2.7! @ryzokuken
- 36. Why introduce anew stage? High quality implementations need tests ...but tests can be expensive to write and costly to iterate as the design changes Test authors want to know when the design is stable ➡ Stage 2.7 Implementers want to know when the tests are ready ➡ Stage 3 🤔 @ryzokuken
- 37. STAGE 2.7 Candidate�� Approved in principle but still needs feedback from testing and implementers We have full spec text! Reviewers and Editors have signed off the spec text We will create test262 conformance tests We might create spec-compliant implementations/polyfills New!
- 38.
- 39. STAGE 2.7 DeferredEvaluation Yulia Startsev, Nicolò Ribaudo
- 40. // This fetchesbut does NOT evaluate "mod" import defer * as ns from "mod"; function rarelyUsed () { // "mod" is lazily evaluated on first use of `ns` console.log(ns.prop); } ... New!
- 41. STAGE 2.7 ShadowRealm DaveHerman, Mark Miller, Caridy Patiño, Leo Balter, Rick Waldron, Chengzhong Wu
- 42. const shadowRealm =new ShadowRealm(); // pluginFramework and pluginScript become available in the ShadowRealm const [ init, ready ] = await Promise.all([ shadowRealm.importValue('./pluginFramework.js', 'init'), shadowRealm.importValue('./pluginScript.js', 'ready'), ]); // The Plugin Script will execute within the ShadowRealm init(ready);
- 43.
- 44. 1e20 + 0.1+ -1e20 === 0 Math.sumPrecise([1e20, 0.1, -1e20]) === 0.1
- 45. STAGE 3 Recommendedfor implementation �� Implementation and validation phase (feedback from implementers, web-compatibility) Tests have been created for test262 We will only change things if implementation reveals new information Engines will begin implementing Browsers may start shipping with or without a flag
- 46. STAGE 3 Temporal PhilippDunkel , Maggie Johnson-Pint, Matt Johnson-Pint, Brian Terlson, Shane Carr, Ujjwal Sharma, Philip Chimento, Jason Williams, Justin Grant
- 48. const yearMonth =Temporal.PlainYearMonth.from({ year: 2020, month: 10 }); yearMonth.toString() // => 2020-10 yearMonth.daysInMonth; // => 31 yearMonth.daysInYear; // => 366 const monthDay = Temporal.PlainMonthDay.from({ month: 7, day: 14 }); const date = monthDay.toPlainDate({ year: 2030 }); date.dayOfWeek; // => 7 date.dayOfYear; // => 195 date.daysInMonth; // => 31 date.daysInYear; // => 365 date.inLeapYear; // => false
- 49. let calcDate =Temporal.Now.plainDateISO(); // => 2021-11-29 calcDate.add({ days : 15 }); // => 2021-12-14 calcDate.subtract({ days : 15 }); // => 2021-11-14 calcDate.equals(calcDate); // => true calcDate.equals(calcDate.add({ days : 2})); // => false
- 50. const time =Temporal.Instant.fromEpochSeconds(new Date); Temporal.TimeZone.from('Europe/Berlin').getOffsetStringFor(time); // => +01:00 Temporal.TimeZone.from('America/Vancouver').getOffsetStringFor(time) // => -08:00 Temporal.TimeZone.from('Europe/Moscow').getOffsetStringFor(time); // => +03:00
- 51. STAGE 3 Decorators KristenHewell Garrett
- 52. function bound(value, {name, addInitializer }) { addInitializer(function () { this[name] = this[name].bind(this); }); } class C { message = "hello!"; @bound m() { console.log(this.message); } } let { m } = new C(); m(); // hello!
- 53. STAGE 4 Finished�� About to be include in the upcoming edition of ECMAScript® We have two implementations that pass the acceptance tests We have real-life experience of shipping the feature We have merged the feature into the Spec It might not yet be shipping in all mainstream engines The feature will be included in the next yearly edition, e.g. ES2024
- 54. STAGE 4 ArrayBuffertransfer Shu-yu Guo, Jordan Harband, Yagiz Nizipli
- 55. function validateAndWriteSafeAndFast(arrayBuffer) { //Transfer to take ownership, which implementations can choose to // implement as a zero-copy move. const owned = arrayBuffer.transfer(); // arrayBuffer is detached after this point. assert(arrayBuffer.detached); await validate(owned); await fs.writeFile("data.bin", owned); }
- 56. STAGE 4 SetMethods Kevin Gibbons
- 57. let odds =new Set([1, 3, 5, 7, 9, 11, 13]); let primes = new Set([2, 3, 5, 7, 11, 13]); let oddPrimes = primes.intersection(odds); // Set { 3, 5, 7, 11, 13 } let evenPrimes = primes.difference(odds); // Set { 2 }
- 58. Array Grouping Atomics.waitAsync Promise.withResolvers Well-Formed UnicodeStrings RegExp v flag + set notation + properties of strings Resizable & growable ArrayBuffers STAGE 4 🎉 ArrayBuffer transfer
- 59.
- 60. Collaboration & Help Getinvolved! 4 @ryzokuken
- 61. Write test262 conformancetests Refine proposals in GitHub issues Write documentation and educational materials Provide feedback on GitHub �� �� �� �� @ryzokuken
- 62.