A presentation at CityJS in in London, UK by Chris Heilmann
<feTurbulence> && !important Chris Heilmann @codepo8 May 2019
Chris Heilmann @codepo8 ▪ Principal Software Development Engineer ▪ Microsoft Edge and Developer Experience (VSCode, Devtools…) ▪ W3C Member WebML Discussion Group ▪ 20 years web developer ▪ eToys, Agilisys, Yahoo, Mozilla… ▪ Wrote 3 books, contributed to 10(?)…
Checking Twitter in the morning… before after
Things we say to each other without considering the context… @codepo8
THIS DoeS NOT wORk wHEN tHE DATA YOu pUt IN is IMpUrE!
THIs DOEsN’T PErFORm WHEN YOU hAVE A LoT OF DATA!
THiS coUlD BE wrITten mUch SHORTER!
THIS dOeS NOt WORK iN oLd BrOwSErS!
THiS IS nOT ACCeSSIbLe!
Knee-jerk reactions…
Create indefensible accusations by zooming out and disregarding circumstances @codepo8
You look clever and caring for the web – without doing any work! @codepo8
Is that worth discouraging people? @codepo8
Is the right place and time to argue for quality when the product is done? @codepo8
!important @codepo8
Things that should matter in a web product Accessibility Interoperability Performance Security
HTML Responsibilities Browser Standard CSS JavaScript Responsibilities You Browser Standard Responsibilities You Browser Standard You
We’re well prepared to create magic…
!important @codepo8
We’re empowered to write great things @codepo8 ▪ Highly optimised code ▪ Reusable, clean components ▪ Modular design systems ▪ Flexible APIs ▪ Asynchronous, streaming services ▪ Experimental, groundbreaking standard proposals ▪ Automation, task runners, bundlers…
Let’s look past our world of conferences, podcasts and magazines… @codepo8
!given Accessibility Interoperability Performance Security
Rampant accessibility failures… @codepo8 https://majestic.com/reports/majestic-million https://majestic.com/reports/majestic-million https://webaim.org/projects/million/
Products full of cruft… @codepo8 https://httparchive.org/reports/page-weight
Web products stack @codepo8 : HTML/CSS/JS https://twitter.com/sebmck/status/1109644524995801088
Front-end: HTML/CSS/JS Realities of web products stack… @codepo8 Back-end: CMS/Frameworks Servers/Cloud DevOps IT Legal Sales Shareholders Investors
We’re competing without knowing it… Staying in budget (time + money) First to Market (FTM) Continuous growth
Budget = reckless re-use Staying in budget (time + money)
Let’s start with a framework… @codepo8
The web is assembled, not authored… @codepo8 https://discuss.httparchive.org/t/what-is-the-distribution-of1st-party-vs-3rd-party-resources/100/14
FTM = FML for quality First to Market (FTM)
MVP First to Market (FTM)
MVP=Minimum Viable Product First to Market (FTM)
MVP=Most Validation Pending is
A series of quick wins? is … MVP#1 MVP#2 MVP#3 MVP#4
Alas, on the web… Staying in budget (time + money) First to Market (FTM) Continuous growth
Growth = stickiness+analytics Continuous growth
Third party slowness and cruft… @codepo8 https://github.com/patrickhulce/third-party-web
Reuse keeps budgets in check is MVP V1 (analytics enabled) V2 (marketing features) V3 (beefier cloud) V4 (enterprise, international rollout) PANIC!!!!!
Let’s hire some consultants to help us with… Accessibility Interoperability Performance Security
Because when it costs money, it is >important
The web is a platform ripe for abuse. @codepo8 ▪ The web is defined as forgiving to developer error ▪ Browsers can’t break the web ▪ Past browser competition = nonstandard APIs live products rely on. ▪ Cruft and security attack vectors ▪ We can’t stop developers from being sloppy…
Patches and “solutions”… @codepo8 ▪ AMP ▪ Safari limiting JavaScript ▪ Chrome’s “Never Slow Mode” ▪ All kind of blockers
Well, …
Front-end: HTML/CSS/JS What can we do? @codepo8 Back-end: CMS/Frameworks Servers/Cloud DevOps IT Legal Sales Shareholders Investors
https://css-tricks.com/make-it-hard-to-screw-up-driven-development/ @codepo8
We have browser tool audits… @codepo8
Auditing report @codepo8
@codepo8
Give feedback and demand features from browsers, frameworks and tools… @codepo8
Stop arguing amongst ourselves which technology is better @codepo8
Contribute to products people use (CMS, build tools, frameworks…) @codepo8
Understand why people do things wrong before telling them off… @codepo8
Earn our seat at the table where stupid decisions are being made @codepo8
The web is plumbing, not the new hotness… @codepo8
Power to the next generation! @codepo8
Thanks! Chris Heilmann @codepo8
for free. You
can too.