Where The Web Is Going @jaredthenerd jaredthenerd.com Where The - PowerPoint PPT Presentation

Where The Web Is Going @jaredthenerd jaredthenerd.com Where The Web Is Going by Jared Faris is licensed under a Creative Commons Attribution-ShareAlike 4.0 International License. https://creativecommons.org/licenses/by-sa/4.0/

How the Web L b Literall lly* y* Works and what we’ll be talking about Your serve rvers s sit here *figu gurative vely

BBQLOL

New Yorker – The Group That Rules The Web http://bit.ly/RulesTheWeb SELFIE!

Web b Sta tandar ndards ds People ople Swe wear r A Lo Lot

“Consensus is not a useful value in Web spec development, because it doesn't accurat ately ely refl flect ect th the powe wer r dynamics ics at t wo work. k. In practi ctice, e, implement ementers ers have ve th the ulti timat ate e say, not t spec editor ors, s, not t auth thor ors, s, not t users, rs, and not t interest ested ed bysta tande nder r sta tandar ardi distas. stas. The W3 W3C a C and th the WH WHATWG WG th thus have ve no powe wer. . (The e WH WHATWG WG is built t arou ound nd th that t reali alization ation; ; th the W3C 3C, howe wever er, is built t on th the assump mptio tion n th that t it t does have powe wer. . That' t's s how w it t ends up making ng mista takes es like e RDF, XForms , or XHTML2.)” Ian Hickson – April 23, 2014

Me Too! <3 OPEN STAND http://bit.ly/WHATWGIPR

.1 Form rm Validatio ation n & F Forced Spellche lcheck ck Cont ntext xt Menus us Date e Pickers Expand nding ing Deta tail il Panels ls

.1

http://bit.ly/HTML5Implementation

.2

More Stuff

CSS Gri rid

CSS Vari riab ables les

UMMMMMMMM… WHAT?

Web b Com omponen ponents ts • HTML Templates • Shadow DOM • Custom Elements • HTML Imports/ES6 Modules

Web b Com omponents ponents In In Acti tion on These get incl clude des with h Polyme ymer and Shady dy DOM. That t is its own talk! k!

http tps: s:// //www ww.w .webc bcomp ompon onent nts.or s.org/ g/

"ECMAScript was always an unwanted trade name that sounds like a skin disease.“ – Brendan Eich

ES 2016 Array.includes ** operator

Array.contains ??? “You're telling me I should ship a browser that chokes on thousands of web sites that work fine today. That would be bad for our users, so I'm not planning on doing that." "Patching 3.5 million websites is not a 'small fix' in any relevant sense.“ – Jason Orendorff (Mozilla)

SMOOSH? Seriously?

https://github.com/staltz/prevent-smoosh

ES 2016 ES 2017 Array.includes Async Lots of little stuff ** operator (Not an actual feature name. Object.values, String Padding, not breaking on trailing commas, etc.)

ES 20 2018 18 ES 20 2019 19 Shared Memory & Atomics Array.prototype.{flat,flatMap} Async Iteration String.prototype.{trimStart, trimEnd} Rest/Spread… operators Some string and JSON improvements RegExp features

JavaScr aScript ipt Develope velopers rs Swe wear r A Lot Lot

Fetch

HTT TTP P Reque quests sts

Servi rvice e Wor orker

Prog ogress essive ive Web b Apps ps Not Google

• 65% increase in pages per session • 75% increase in Tweets sent • 20% decrease in bounce rate Not Google

Twitter Is Complicated… Here’s a dumb example

Offline?

What about Web Assembly? “ WebAssembly (abbreviated Wasm) is a binary instruction format for a stack-based virtual machine. Wasm is designed as a portable target for compilation of high-level languages like C/C++/Rust, enabling deployment on the web for client and server applications.”

How we code the web today* * not shown: 400 npm packages and a complicated build system How Web Assembly works Modules… remember those? + C#, Rust, C# (sorta), Java, Python, etc. etc. Too lazy to draw a ton of language icons ;)

“Why would I …?” Good question Most use cases are dumb… today

“Oh, good…” • Build high performing applications (video chat, gaming, CAD, etc.) • Re-use complicated business logic • Build things like ML or VR • Avoid writing JavaScript

Tube be In Internet rnet Enginee gineering ring Task -- ----- --- k For orce

Bin inary ary Fr Frami ming ng La Layer er

Security urity Resear earchers chers Swe wear r A Lot Lot

And what about…? In Internet rnet Exchr chrome omedgium dgium!* !* * Not offici cial title

Th This is im impacts: cts: In Interoper operabili ability ty • • Sta tandar ndards ds com ompli plianc ance Develop veloper er expe xperi rienc ence • It doesn’t directly change: Platf atform orm fu functionality ctionality • • Sta tandar ndards ds developme velopment nt

htt ttps:/ ps://w /www ww.micr microsoft osofted edgeinsid geinsider er.c .com om

THANK YOU! @jaredthenerd jaredthenerd.com