What I learned at the edge conference
-
Upload
james-ford -
Category
Technology
-
view
34 -
download
3
Transcript of What I learned at the edge conference
![Page 1: What I learned at the edge conference](https://reader031.fdocuments.us/reader031/viewer/2022030310/58f0a49e1a28ab39668b4625/html5/thumbnails/1.jpg)
What I learned at the
![Page 2: What I learned at the edge conference](https://reader031.fdocuments.us/reader031/viewer/2022030310/58f0a49e1a28ab39668b4625/html5/thumbnails/2.jpg)
Security, SSL & HTTPS
![Page 3: What I learned at the edge conference](https://reader031.fdocuments.us/reader031/viewer/2022030310/58f0a49e1a28ab39668b4625/html5/thumbnails/3.jpg)
![Page 4: What I learned at the edge conference](https://reader031.fdocuments.us/reader031/viewer/2022030310/58f0a49e1a28ab39668b4625/html5/thumbnails/4.jpg)
HTTPS has issues.
![Page 5: What I learned at the edge conference](https://reader031.fdocuments.us/reader031/viewer/2022030310/58f0a49e1a28ab39668b4625/html5/thumbnails/5.jpg)
SecurityTheatre
![Page 6: What I learned at the edge conference](https://reader031.fdocuments.us/reader031/viewer/2022030310/58f0a49e1a28ab39668b4625/html5/thumbnails/6.jpg)
The Padlock is a broken metaphor for online security
![Page 7: What I learned at the edge conference](https://reader031.fdocuments.us/reader031/viewer/2022030310/58f0a49e1a28ab39668b4625/html5/thumbnails/7.jpg)
We’ve been training users to trust the wrong things
![Page 8: What I learned at the edge conference](https://reader031.fdocuments.us/reader031/viewer/2022030310/58f0a49e1a28ab39668b4625/html5/thumbnails/8.jpg)
What does HTTPS mean?Protection against man-in-the-middle attacks*Encrypted connection
The server hasn’t been compromisedThe company is legitimateThe database is secure, encrypted and safe from future intrusionYour machine isn’t compromisedThe connection isn’t wiretappedThe security keys aren’t compromised
![Page 9: What I learned at the edge conference](https://reader031.fdocuments.us/reader031/viewer/2022030310/58f0a49e1a28ab39668b4625/html5/thumbnails/9.jpg)
The problems with HTTPS1. Users have been trained to associate them with a level of
trustworthiness which they can not represent
2. SSL certificates:a. cost money and time to obtainb. are difficult to configure on a server
![Page 10: What I learned at the edge conference](https://reader031.fdocuments.us/reader031/viewer/2022030310/58f0a49e1a28ab39668b4625/html5/thumbnails/10.jpg)
Encouraging HTTPS● Change the messaging from positive to negative
● Make it faster than HTTP
● Only enable new HTML features to HTTPS websites
● Make it free and easy
![Page 11: What I learned at the edge conference](https://reader031.fdocuments.us/reader031/viewer/2022030310/58f0a49e1a28ab39668b4625/html5/thumbnails/11.jpg)
HTTPS ALL THE THINGS!
![Page 12: What I learned at the edge conference](https://reader031.fdocuments.us/reader031/viewer/2022030310/58f0a49e1a28ab39668b4625/html5/thumbnails/12.jpg)
Front End Data
![Page 13: What I learned at the edge conference](https://reader031.fdocuments.us/reader031/viewer/2022030310/58f0a49e1a28ab39668b4625/html5/thumbnails/13.jpg)
What about Front End Data?● Local caching, and control of data caching
● Background workers
● Functional offline applications
● Browser support, limitations & time-to-adoption
● Data Persistence
![Page 14: What I learned at the edge conference](https://reader031.fdocuments.us/reader031/viewer/2022030310/58f0a49e1a28ab39668b4625/html5/thumbnails/14.jpg)
Client-side caches● Local caches are always faster than server callbacks
● Lots of technologies available, with different features
● Store flat or structured data, or file blobs
● Can be queried like a database, or treated as a key-value store
● Polyfils and libraries abstract away browser support issues and awkward low-level APIs
![Page 15: What I learned at the edge conference](https://reader031.fdocuments.us/reader031/viewer/2022030310/58f0a49e1a28ab39668b4625/html5/thumbnails/15.jpg)
Websites that work Offline● ServiceWorker is a programmable network proxy - a
background script with the ability to intercept and modify any request to the website
● Combined with a scriptable cache, we can control how the website behaves without access to the internet
![Page 16: What I learned at the edge conference](https://reader031.fdocuments.us/reader031/viewer/2022030310/58f0a49e1a28ab39668b4625/html5/thumbnails/16.jpg)
http://nolanlawson.github.io/edgeconf-2015/
![Page 17: What I learned at the edge conference](https://reader031.fdocuments.us/reader031/viewer/2022030310/58f0a49e1a28ab39668b4625/html5/thumbnails/17.jpg)
![Page 18: What I learned at the edge conference](https://reader031.fdocuments.us/reader031/viewer/2022030310/58f0a49e1a28ab39668b4625/html5/thumbnails/18.jpg)
Progressive Enhancement
Graceful Degradation
![Page 19: What I learned at the edge conference](https://reader031.fdocuments.us/reader031/viewer/2022030310/58f0a49e1a28ab39668b4625/html5/thumbnails/19.jpg)
Quotas & Storage management● Data persistence and reliability is a concern for many people
● No standard for managing syncs between servers and clients
● Browser vendors which have implemented this have yet to make quotas and storage consumption/management transparent to users
![Page 20: What I learned at the edge conference](https://reader031.fdocuments.us/reader031/viewer/2022030310/58f0a49e1a28ab39668b4625/html5/thumbnails/20.jpg)
Encouraging HTTPS● Change the messaging from positive to negative
● Make it faster than HTTP
● Only enable new HTML features to HTTPS websites
● Make it free and easy
ServiceWorker is one of these
![Page 21: What I learned at the edge conference](https://reader031.fdocuments.us/reader031/viewer/2022030310/58f0a49e1a28ab39668b4625/html5/thumbnails/21.jpg)
Performance
![Page 22: What I learned at the edge conference](https://reader031.fdocuments.us/reader031/viewer/2022030310/58f0a49e1a28ab39668b4625/html5/thumbnails/22.jpg)
Convincing people that #perfmatters● Nobody is convinced by stats or case studies from Amazon
● Personalised comparisons against the competition works best
● Filmstrip views from WebPageTest are great because they’re visual
● Filmstrip functionality is coming in DevTools soon(?)
● https://speedcurve.com/ is a paid-for, client-centric version of WebPageTest
![Page 23: What I learned at the edge conference](https://reader031.fdocuments.us/reader031/viewer/2022030310/58f0a49e1a28ab39668b4625/html5/thumbnails/23.jpg)
What does even mean?● The ‘load indicator’ currently represents network activity - but should it
indicate content interactivity instead?
● Would it help or hinder developers, and would it be beneficial for users?
● Would it make the browser seem faster or slower?
● To whom does the user attribute blame for janky content, stutters and poor performance?
![Page 24: What I learned at the edge conference](https://reader031.fdocuments.us/reader031/viewer/2022030310/58f0a49e1a28ab39668b4625/html5/thumbnails/24.jpg)
and the rest…
![Page 25: What I learned at the edge conference](https://reader031.fdocuments.us/reader031/viewer/2022030310/58f0a49e1a28ab39668b4625/html5/thumbnails/25.jpg)
Components & Modules● More options around than 3 years ago (the first Edge Conference), but no
closer to general adoption outside of specific frameworks.
● [Browser vendors] can’t agree on standards to implement, which requires extensive libraries to support, and each of them has to reinvent the wheel with a virtual DOM
● Frankly, it’s still too underexplored for a standard to emerge yet - many implementations are too specialised to be generally useful
![Page 26: What I learned at the edge conference](https://reader031.fdocuments.us/reader031/viewer/2022030310/58f0a49e1a28ab39668b4625/html5/thumbnails/26.jpg)
Progressive Enhancement● It’s a term so ambiguous we can’t even agree what it means and have a
focussed discussion on it without repeatedly trying to define it
● It’s not just about ‘making it work without JavaScript’
● It’s not about accessible content (or is it?)
● What’s the starting point? Is the lowest common denominator too low?