Save 37% off PRO during our Black Friday Sale! »

What I learned at the Edge conference 2015

What I learned at the Edge conference 2015

From July 17, 2015, this is a recap of the lessons learnt from the 2015 Edge conference, featuring HTTPS, Security, Front End Data, ServiceWorker, Offline websites and more.

50bd52fe63e2264aeae49b33d0e9102e?s=128

James Ford

July 17, 2015
Tweet

Transcript

  1. What I learned at the

  2. Security, SSL & HTTPS

  3. None
  4. HTTPS has issues.

  5. Security Theatre

  6. The Padlock is a broken metaphor for online security

  7. We’ve been training users to trust the wrong things

  8. What does HTTPS mean? Protection against man-in-the-middle attacks* Encrypted connection

    The server hasn’t been compromised The company is legitimate The database is secure, encrypted and safe from future intrusion Your machine isn’t compromised The connection isn’t wiretapped The security keys aren’t compromised
  9. The problems with HTTPS 1. 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 obtain b. are difficult to configure on a server
  10. 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
  11. HTTPS ALL THE THINGS!

  12. Front End Data

  13. 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
  14. 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
  15. 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
  16. http://nolanlawson.github.io/edgeconf-2015/

  17. None
  18. Progressive Enhancement Graceful Degradation

  19. 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
  20. 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
  21. Performance

  22. 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
  23. 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?
  24. and the rest…

  25. 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
  26. 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?