ºÝºÝߣ

ºÝºÝߣShare a Scribd company logo
Hitchhiker¡¯s Guide to Web
Standards
Dominic Farolino
? twitter.com/domfarolino

? github.com/domfarolino

? dom@chromium.org
? Senior @ University of Cincinnati

? Previously Microsoft, Mozilla

? Incoming @ Google

? Chromium Committer

? WHATWG Editor
What is this talk?
@domfarolino dom@chromium.org
Background & History
(this could really be its own talk)
@domfarolino dom@chromium.org
Intro to technical bits of specs
@domfarolino dom@chromium.org
How to get involved?
(you can do it!!)
@domfarolino dom@chromium.org
What is a ¡°standard¡±?
Depends on the context
@domfarolino dom@chromium.org
¨Cyours truly
¡°A document specifying observable effects of tech with multiple
independent implementations¡±
@domfarolino dom@chromium.org
¨Cyours truly
¡°A document specifying observable effects of tech with multiple
independent implementations¡±
@domfarolino dom@chromium.org
Unix OS¡¯s
@domfarolino dom@chromium.org
Unix OS¡¯s
Web Tech
@domfarolino dom@chromium.org
Unix OS¡¯s
Web Tech
HTTP
@domfarolino dom@chromium.org
Unix OS¡¯s
Web Tech
HTTP JS
@domfarolino dom@chromium.org
Unix OS¡¯s
Web Tech
HTTP JS
Web Platform APIs
@domfarolino dom@chromium.org
Unix OS¡¯s
Web Tech
HTTP JS
Web Platform APIs
@domfarolino dom@chromium.org
Unix OS¡¯s
Web Tech
HTTP JS
Web Platform APIs
@domfarolino dom@chromium.org
Unix OS¡¯s
Web Tech
HTTP JS
Web Platform APIs
@domfarolino dom@chromium.org
Unix OS¡¯s
Web Tech
HTTP JS
Web Platform APIs
@domfarolino dom@chromium.org
Where do Web APIs come
from?
@domfarolino dom@chromium.org
const logicalAnswer = ¡°JavaScript¡±
@domfarolino dom@chromium.org
@domfarolino dom@chromium.org
@domfarolino dom@chromium.org
What is JavaScript
? Just a language

? History

? Standardized by ECMAScript

? Multiple independent implementations exist
@domfarolino dom@chromium.org
ES Engines
? V8 (Chrome)

? Chakra (Edge)

? SpiderMonkey (Firefox)

? JavaScriptCore (Safari/WebKit)
@domfarolino dom@chromium.org
Hitchhiker's Guide to Web Standards
Hitchhiker's Guide to Web Standards
ECMAScript
@domfarolino dom@chromium.org
ECMAScript
? Needed to be a general standard
@domfarolino dom@chromium.org
ECMAScript
? Needed to be a general standard
? Speci?es only a language; separation of concerns

? Syntax, semantics, constructs, primitives

? Language should not know about its environment at all

? No explicit knowledge of language¡¯s host (DOM / fetch() / etc)
@domfarolino dom@chromium.org
Web API Origins
? Not part of the language itself

? E?ectively ¡°mixins¡±, baked into UAs like browsers

? Browsers ¡°support¡± implementations of these standards
@domfarolino dom@chromium.org
Web Standards Bodies
@domfarolino dom@chromium.org
WHATWG
@domfarolino dom@chromium.org
WHATWG
? Web Hypertext Application Technology Working Group
@domfarolino dom@chromium.org
WHATWG
? Web Hypertext Application Technology Working Group
? Formed in 2004
@domfarolino dom@chromium.org
WHATWG
? Web Hypertext Application Technology Working Group
? Formed in 2004
? Canonical standards:

? HTML

? DOM

? Fetch

? Streams
@domfarolino dom@chromium.org
Hitchhiker's Guide to Web Standards
ES Array, WeakMap, Date
ES
DOM APIs
Array, WeakMap, Date
document.querySelector
ES
DOM APIs
Fetch/Networking
Array, WeakMap, Date
document.querySelector
fetch(), Request(), ¡­
ES
DOM APIs
Fetch/Networking
Console
Array, WeakMap, Date
document.querySelector
fetch(), Request(), ¡­
console.{log, count, ¡­}
Anatomy of a standard
@domfarolino dom@chromium.org
Algorithms
@domfarolino dom@chromium.org
https://console.spec.whatwg.org/#count
@domfarolino dom@chromium.org
https://console.spec.whatwg.org/#count
@domfarolino dom@chromium.org
Look and Feel
@domfarolino dom@chromium.org
@domfarolino dom@chromium.org
@domfarolino dom@chromium.org
@domfarolino dom@chromium.org
JS Type
(Object, String, Number,
Symbol, Boolean)
Web
Developer
Web IDL Conversion
Web IDL
Sheriff
JS Type
(Object, String, Number,
Symbol, Boolean)
Web
Developer
Web IDL
Web IDL Conversion
Successful
callWeb IDL
Sheriff
JS Type
(Object, String, Number,
Symbol, Boolean)
Algorithm
Web
Developer
Web IDL
Web IDL Conversion
Code
Jail
Web
Developer
Web IDL
Sheriff
JS Type
(Object, String, Number,
Symbol, Boolean)
TypeErrorWeb IDL
Web IDL Conversion
Web IDL
https://heycam.github.io/webidl/#es-DOMString
@domfarolino dom@chromium.org
@domfarolino dom@chromium.org
Why use Web IDL?
@domfarolino dom@chromium.org
Why use Web IDL?
? Abstraction over ECMAScript text
@domfarolino dom@chromium.org
Why use Web IDL?
? Abstraction over ECMAScript text
? Takes care of things for us:

? Property init (Prototype chain, property descriptors, ¡­)

? Type conversion

? Where to expose interfaces
@domfarolino dom@chromium.org
Why use Web IDL?
? Abstraction over ECMAScript text
? Takes care of things for us:

? Property init (Prototype chain, property descriptors, ¡­)

? Type conversion

? Where to expose interfaces
? Don¡¯t have to use it
@domfarolino dom@chromium.org
How I got involved?
@domfarolino dom@chromium.org
@domfarolino dom@chromium.org
Hitchhiker's Guide to Web Standards
@domfarolino dom@chromium.org
WHATWG
#whatwg GitHub
@domfarolino dom@chromium.org
Why?
@domfarolino dom@chromium.org
domfarolino/cascadiajs
@domfarolino dom@chromium.org
Things I¡¯ve done
Things I¡¯ve done
? Changed how fetch() works
Things I¡¯ve done
? Changed how fetch() works
? Changed how module scripts are fetched
Things I¡¯ve done
? Changed how fetch() works
? Changed how module scripts are fetched
? <script referrerpolicy=¡°¡±>
Things I¡¯ve done
? Changed how fetch() works
? Changed how module scripts are fetched
? <script referrerpolicy=¡°¡±>
? Implemented console APIs
Things I¡¯ve done
? Changed how fetch() works
? Changed how module scripts are fetched
? <script referrerpolicy=¡°¡±>
? Implemented console APIs
? Priority Hints

More Related Content

Similar to Hitchhiker's Guide to Web Standards (20)

Front end for back end developers
Front end for back end developersFront end for back end developers
Front end for back end developers
Wojciech Bednarski
?
IT Systems for Knowledge Management used in Software Engineering (2010)
IT Systems for Knowledge Management used in Software Engineering (2010)IT Systems for Knowledge Management used in Software Engineering (2010)
IT Systems for Knowledge Management used in Software Engineering (2010)
Peter Kofler
?
ARTDM 171, Week 2: A Brief History + Web Basics
ARTDM 171, Week 2: A Brief History + Web BasicsARTDM 171, Week 2: A Brief History + Web Basics
ARTDM 171, Week 2: A Brief History + Web Basics
Gilbert Guerrero
?
Protect Your Payloads: Modern Keying Techniques
Protect Your Payloads: Modern Keying TechniquesProtect Your Payloads: Modern Keying Techniques
Protect Your Payloads: Modern Keying Techniques
Leo Loobeek
?
±á°Õ²Ñ³¢5¤Î¤´Éܽé
±á°Õ²Ñ³¢5¤Î¤´Éܽé±á°Õ²Ñ³¢5¤Î¤´Éܽé
±á°Õ²Ñ³¢5¤Î¤´Éܽé
yoshikawa_t
?
Web Development with Python and Django
Web Development with Python and DjangoWeb Development with Python and Django
Web Development with Python and Django
Michael Pirnat
?
Measuring Front-End Performance - What, When and How?
Measuring Front-End Performance - What, When and How?Measuring Front-End Performance - What, When and How?
Measuring Front-End Performance - What, When and How?
Gareth Hughes
?
Introduction to Browser DOM
Introduction to Browser DOMIntroduction to Browser DOM
Introduction to Browser DOM
Siva Arunachalam
?
OnAndroidConf 2013: Accelerating the Android Platform Build
OnAndroidConf 2013: Accelerating the Android Platform BuildOnAndroidConf 2013: Accelerating the Android Platform Build
OnAndroidConf 2013: Accelerating the Android Platform Build
David Rosen
?
Geek basics
Geek basicsGeek basics
Geek basics
kdmcBerkeley at UC Berkeley
?
Demystifying WordPress
Demystifying WordPressDemystifying WordPress
Demystifying WordPress
Mykl Roventine
?
CSW2017 Geshev+Miller logic bug hunting in chrome on android
CSW2017 Geshev+Miller logic bug hunting in chrome on androidCSW2017 Geshev+Miller logic bug hunting in chrome on android
CSW2017 Geshev+Miller logic bug hunting in chrome on android
CanSecWest
?
Useful Websites (Report in Online Journalism)
Useful Websites (Report in Online Journalism)Useful Websites (Report in Online Journalism)
Useful Websites (Report in Online Journalism)
Kim Ortego
?
Stencil the time for vanilla web components has arrived
Stencil the time for vanilla web components has arrivedStencil the time for vanilla web components has arrived
Stencil the time for vanilla web components has arrived
Gil Fink
?
PhoneGap at Facebook Mobile Hack
PhoneGap at Facebook Mobile HackPhoneGap at Facebook Mobile Hack
PhoneGap at Facebook Mobile Hack
PhoneGap
?
Notes From Velocity Conference Europe
Notes From Velocity Conference EuropeNotes From Velocity Conference Europe
Notes From Velocity Conference Europe
SiriusWay
?
Simplify integrations-final-pdf
Simplify integrations-final-pdfSimplify integrations-final-pdf
Simplify integrations-final-pdf
Christian Posta
?
Code for Startup MVP (Ruby on Rails) Session 1
Code for Startup MVP (Ruby on Rails) Session 1Code for Startup MVP (Ruby on Rails) Session 1
Code for Startup MVP (Ruby on Rails) Session 1
Henry S
?
Txjs
TxjsTxjs
Txjs
Brian LeRoux
?
Simplify your integrations with Apache Camel
Simplify your integrations with Apache CamelSimplify your integrations with Apache Camel
Simplify your integrations with Apache Camel
Kenneth Peeples
?
Front end for back end developers
Front end for back end developersFront end for back end developers
Front end for back end developers
Wojciech Bednarski
?
IT Systems for Knowledge Management used in Software Engineering (2010)
IT Systems for Knowledge Management used in Software Engineering (2010)IT Systems for Knowledge Management used in Software Engineering (2010)
IT Systems for Knowledge Management used in Software Engineering (2010)
Peter Kofler
?
ARTDM 171, Week 2: A Brief History + Web Basics
ARTDM 171, Week 2: A Brief History + Web BasicsARTDM 171, Week 2: A Brief History + Web Basics
ARTDM 171, Week 2: A Brief History + Web Basics
Gilbert Guerrero
?
Protect Your Payloads: Modern Keying Techniques
Protect Your Payloads: Modern Keying TechniquesProtect Your Payloads: Modern Keying Techniques
Protect Your Payloads: Modern Keying Techniques
Leo Loobeek
?
±á°Õ²Ñ³¢5¤Î¤´Éܽé
±á°Õ²Ñ³¢5¤Î¤´Éܽé±á°Õ²Ñ³¢5¤Î¤´Éܽé
±á°Õ²Ñ³¢5¤Î¤´Éܽé
yoshikawa_t
?
Web Development with Python and Django
Web Development with Python and DjangoWeb Development with Python and Django
Web Development with Python and Django
Michael Pirnat
?
Measuring Front-End Performance - What, When and How?
Measuring Front-End Performance - What, When and How?Measuring Front-End Performance - What, When and How?
Measuring Front-End Performance - What, When and How?
Gareth Hughes
?
OnAndroidConf 2013: Accelerating the Android Platform Build
OnAndroidConf 2013: Accelerating the Android Platform BuildOnAndroidConf 2013: Accelerating the Android Platform Build
OnAndroidConf 2013: Accelerating the Android Platform Build
David Rosen
?
CSW2017 Geshev+Miller logic bug hunting in chrome on android
CSW2017 Geshev+Miller logic bug hunting in chrome on androidCSW2017 Geshev+Miller logic bug hunting in chrome on android
CSW2017 Geshev+Miller logic bug hunting in chrome on android
CanSecWest
?
Useful Websites (Report in Online Journalism)
Useful Websites (Report in Online Journalism)Useful Websites (Report in Online Journalism)
Useful Websites (Report in Online Journalism)
Kim Ortego
?
Stencil the time for vanilla web components has arrived
Stencil the time for vanilla web components has arrivedStencil the time for vanilla web components has arrived
Stencil the time for vanilla web components has arrived
Gil Fink
?
PhoneGap at Facebook Mobile Hack
PhoneGap at Facebook Mobile HackPhoneGap at Facebook Mobile Hack
PhoneGap at Facebook Mobile Hack
PhoneGap
?
Notes From Velocity Conference Europe
Notes From Velocity Conference EuropeNotes From Velocity Conference Europe
Notes From Velocity Conference Europe
SiriusWay
?
Simplify integrations-final-pdf
Simplify integrations-final-pdfSimplify integrations-final-pdf
Simplify integrations-final-pdf
Christian Posta
?
Code for Startup MVP (Ruby on Rails) Session 1
Code for Startup MVP (Ruby on Rails) Session 1Code for Startup MVP (Ruby on Rails) Session 1
Code for Startup MVP (Ruby on Rails) Session 1
Henry S
?
Simplify your integrations with Apache Camel
Simplify your integrations with Apache CamelSimplify your integrations with Apache Camel
Simplify your integrations with Apache Camel
Kenneth Peeples
?

Recently uploaded (20)

Cloud Computing concepts and technologies
Cloud Computing concepts and technologiesCloud Computing concepts and technologies
Cloud Computing concepts and technologies
ssuser4c9444
?
Mathematics behind machine learning INT255 INT255__Unit 3__PPT-1.pptx
Mathematics behind machine learning INT255 INT255__Unit 3__PPT-1.pptxMathematics behind machine learning INT255 INT255__Unit 3__PPT-1.pptx
Mathematics behind machine learning INT255 INT255__Unit 3__PPT-1.pptx
ppkmurthy2006
?
Taykon-Kalite belgeleri
Taykon-Kalite belgeleriTaykon-Kalite belgeleri
Taykon-Kalite belgeleri
TAYKON
?
CS3451 INTRODUCTIONN TO OS unit ONE .pdf
CS3451 INTRODUCTIONN TO OS unit ONE .pdfCS3451 INTRODUCTIONN TO OS unit ONE .pdf
CS3451 INTRODUCTIONN TO OS unit ONE .pdf
PonniS7
?
Industrial Construction shed PEB MFG.pdf
Industrial Construction shed PEB MFG.pdfIndustrial Construction shed PEB MFG.pdf
Industrial Construction shed PEB MFG.pdf
PLINTH & ROOFS
?
Frankfurt University of Applied Science urkunde
Frankfurt University of Applied Science urkundeFrankfurt University of Applied Science urkunde
Frankfurt University of Applied Science urkunde
Lisa Emerson
?
TM-ASP-101-RF_Air Press manual crimping machine.pdf
TM-ASP-101-RF_Air Press manual crimping machine.pdfTM-ASP-101-RF_Air Press manual crimping machine.pdf
TM-ASP-101-RF_Air Press manual crimping machine.pdf
ChungLe60
?
Lectureof nano 1588236675-biosensors (1).ppt
Lectureof nano 1588236675-biosensors (1).pptLectureof nano 1588236675-biosensors (1).ppt
Lectureof nano 1588236675-biosensors (1).ppt
SherifElGohary7
?
Syntax Directed Definitions Synthesized Attributes and Inherited Attributes
Syntax Directed Definitions  Synthesized Attributes  and  Inherited AttributesSyntax Directed Definitions  Synthesized Attributes  and  Inherited Attributes
Syntax Directed Definitions Synthesized Attributes and Inherited Attributes
GunjalSanjay
?
Sachpazis: Foundation Analysis and Design: Single Piles
Sachpazis: Foundation Analysis and Design: Single PilesSachpazis: Foundation Analysis and Design: Single Piles
Sachpazis: Foundation Analysis and Design: Single Piles
Dr.Costas Sachpazis
?
Equipment for Gas Metal Arc Welding Process
Equipment for Gas Metal Arc Welding ProcessEquipment for Gas Metal Arc Welding Process
Equipment for Gas Metal Arc Welding Process
AhmadKamil87
?
How Engineering Model Making Brings Designs to Life.pdf
How Engineering Model Making Brings Designs to Life.pdfHow Engineering Model Making Brings Designs to Life.pdf
How Engineering Model Making Brings Designs to Life.pdf
Maadhu Creatives-Model Making Company
?
Mathematics_behind_machine_learning_INT255.pptx
Mathematics_behind_machine_learning_INT255.pptxMathematics_behind_machine_learning_INT255.pptx
Mathematics_behind_machine_learning_INT255.pptx
ppkmurthy2006
?
only history of java.pptx real bihind the name java
only history of java.pptx real bihind the name javaonly history of java.pptx real bihind the name java
only history of java.pptx real bihind the name java
mushtaqsaliq9
?
GM Meeting 070225 TO 130225 for 2024.pptx
GM Meeting 070225 TO 130225 for 2024.pptxGM Meeting 070225 TO 130225 for 2024.pptx
GM Meeting 070225 TO 130225 for 2024.pptx
crdslalcomumbai
?
How to Build a Maze Solving Robot Using Arduino
How to Build a Maze Solving Robot Using ArduinoHow to Build a Maze Solving Robot Using Arduino
How to Build a Maze Solving Robot Using Arduino
CircuitDigest
?
decarbonization steel industry rev1.pptx
decarbonization steel industry rev1.pptxdecarbonization steel industry rev1.pptx
decarbonization steel industry rev1.pptx
gonzalezolabarriaped
?
UNIT 1FUNDAMENTALS OF OPERATING SYSTEMS.pptx
UNIT 1FUNDAMENTALS OF OPERATING SYSTEMS.pptxUNIT 1FUNDAMENTALS OF OPERATING SYSTEMS.pptx
UNIT 1FUNDAMENTALS OF OPERATING SYSTEMS.pptx
KesavanT10
?
RAMSES- EDITORIAL SAMPLE FOR DSSPC C.pptx
RAMSES- EDITORIAL SAMPLE FOR DSSPC C.pptxRAMSES- EDITORIAL SAMPLE FOR DSSPC C.pptx
RAMSES- EDITORIAL SAMPLE FOR DSSPC C.pptx
JenTeruel1
?
How to Make an RFID Door Lock System using Arduino
How to Make an RFID Door Lock System using ArduinoHow to Make an RFID Door Lock System using Arduino
How to Make an RFID Door Lock System using Arduino
CircuitDigest
?
Cloud Computing concepts and technologies
Cloud Computing concepts and technologiesCloud Computing concepts and technologies
Cloud Computing concepts and technologies
ssuser4c9444
?
Mathematics behind machine learning INT255 INT255__Unit 3__PPT-1.pptx
Mathematics behind machine learning INT255 INT255__Unit 3__PPT-1.pptxMathematics behind machine learning INT255 INT255__Unit 3__PPT-1.pptx
Mathematics behind machine learning INT255 INT255__Unit 3__PPT-1.pptx
ppkmurthy2006
?
Taykon-Kalite belgeleri
Taykon-Kalite belgeleriTaykon-Kalite belgeleri
Taykon-Kalite belgeleri
TAYKON
?
CS3451 INTRODUCTIONN TO OS unit ONE .pdf
CS3451 INTRODUCTIONN TO OS unit ONE .pdfCS3451 INTRODUCTIONN TO OS unit ONE .pdf
CS3451 INTRODUCTIONN TO OS unit ONE .pdf
PonniS7
?
Industrial Construction shed PEB MFG.pdf
Industrial Construction shed PEB MFG.pdfIndustrial Construction shed PEB MFG.pdf
Industrial Construction shed PEB MFG.pdf
PLINTH & ROOFS
?
Frankfurt University of Applied Science urkunde
Frankfurt University of Applied Science urkundeFrankfurt University of Applied Science urkunde
Frankfurt University of Applied Science urkunde
Lisa Emerson
?
TM-ASP-101-RF_Air Press manual crimping machine.pdf
TM-ASP-101-RF_Air Press manual crimping machine.pdfTM-ASP-101-RF_Air Press manual crimping machine.pdf
TM-ASP-101-RF_Air Press manual crimping machine.pdf
ChungLe60
?
Lectureof nano 1588236675-biosensors (1).ppt
Lectureof nano 1588236675-biosensors (1).pptLectureof nano 1588236675-biosensors (1).ppt
Lectureof nano 1588236675-biosensors (1).ppt
SherifElGohary7
?
Syntax Directed Definitions Synthesized Attributes and Inherited Attributes
Syntax Directed Definitions  Synthesized Attributes  and  Inherited AttributesSyntax Directed Definitions  Synthesized Attributes  and  Inherited Attributes
Syntax Directed Definitions Synthesized Attributes and Inherited Attributes
GunjalSanjay
?
Sachpazis: Foundation Analysis and Design: Single Piles
Sachpazis: Foundation Analysis and Design: Single PilesSachpazis: Foundation Analysis and Design: Single Piles
Sachpazis: Foundation Analysis and Design: Single Piles
Dr.Costas Sachpazis
?
Equipment for Gas Metal Arc Welding Process
Equipment for Gas Metal Arc Welding ProcessEquipment for Gas Metal Arc Welding Process
Equipment for Gas Metal Arc Welding Process
AhmadKamil87
?
Mathematics_behind_machine_learning_INT255.pptx
Mathematics_behind_machine_learning_INT255.pptxMathematics_behind_machine_learning_INT255.pptx
Mathematics_behind_machine_learning_INT255.pptx
ppkmurthy2006
?
only history of java.pptx real bihind the name java
only history of java.pptx real bihind the name javaonly history of java.pptx real bihind the name java
only history of java.pptx real bihind the name java
mushtaqsaliq9
?
GM Meeting 070225 TO 130225 for 2024.pptx
GM Meeting 070225 TO 130225 for 2024.pptxGM Meeting 070225 TO 130225 for 2024.pptx
GM Meeting 070225 TO 130225 for 2024.pptx
crdslalcomumbai
?
How to Build a Maze Solving Robot Using Arduino
How to Build a Maze Solving Robot Using ArduinoHow to Build a Maze Solving Robot Using Arduino
How to Build a Maze Solving Robot Using Arduino
CircuitDigest
?
decarbonization steel industry rev1.pptx
decarbonization steel industry rev1.pptxdecarbonization steel industry rev1.pptx
decarbonization steel industry rev1.pptx
gonzalezolabarriaped
?
UNIT 1FUNDAMENTALS OF OPERATING SYSTEMS.pptx
UNIT 1FUNDAMENTALS OF OPERATING SYSTEMS.pptxUNIT 1FUNDAMENTALS OF OPERATING SYSTEMS.pptx
UNIT 1FUNDAMENTALS OF OPERATING SYSTEMS.pptx
KesavanT10
?
RAMSES- EDITORIAL SAMPLE FOR DSSPC C.pptx
RAMSES- EDITORIAL SAMPLE FOR DSSPC C.pptxRAMSES- EDITORIAL SAMPLE FOR DSSPC C.pptx
RAMSES- EDITORIAL SAMPLE FOR DSSPC C.pptx
JenTeruel1
?
How to Make an RFID Door Lock System using Arduino
How to Make an RFID Door Lock System using ArduinoHow to Make an RFID Door Lock System using Arduino
How to Make an RFID Door Lock System using Arduino
CircuitDigest
?

Hitchhiker's Guide to Web Standards