Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Everything web and why open matters

Everything web and why open matters

My Slides of my Keynote at IJS 2017 in Munich (https://javascript-conference.com/).

Carsten Sandtner

October 25, 2017
Tweet

More Decks by Carsten Sandtner

Other Decks in Technology

Transcript

  1. Hello! I am Carsten! @casarock at Twitter Technical Director at

    mediaman GmbH RheinMainJS Co-Orga moz://a TechSpeaker
  2. Arms race of features! Browser Wars This awesome Lego Idea

    is © by MTTBSSTT https://ideas.lego.com/projects/859b4a49-324d-4671-b8f0-d9b1eebad63d
  3. Internet Explorer won • Development stopped for at least five

    years!
 • Pages were optimised for one browser
 • Standards? IE was the standard
  4. Browser detection function lib_bwcheck() { this.ver = navigator.appVersion this.agent =

    navigator.userAgent this.dom = document.getElementById ? 1 : 0 this.opera5 = this.agent.indexOf("Opera 5") > -1 this.ie5 = (this.ver.indexOf("MSIE 5") > -1 !&& this.dom !&& !this.opera5) ? 1 : 0; this.ie6 = (this.ver.indexOf("MSIE 6") > -1 !&& this.dom !&& !this.opera5) ? 1 : 0; this.ie4 = (document.all !&& !this.dom !&& ! this.opera5) ? 1 : 0; this.ie = this.ie4 !|| this.ie5 !|| this.ie6 this.mac = this.agent.indexOf("Mac") > -1 this.ns6 = (this.dom !&& parseInt(this.ver) !>= 5) ? 1 : 0; this.ns4 = (document.layers !&& !this.dom) ? 1 : 0; this.bw = (this.ie6 !|| this.ie5 !|| this.ie4 !|| this.ns4 !|| this.ns6 !|| this.opera5) return this }
  5. User Agent Strings !// grandmother of all! Mosaic/0.9 !// Netscapes

    first! Mozilla/2.02 [fr] (WinNT; I) !// IE4! Mozilla/4.0 (compatible; MSIE 4.0; Windows 98) !// And now? Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US) AppleWebKit/525.13 (KHTML, like Gecko) Mozilla/5.0 (Macintosh; Intel Mac OS X 10_12_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/ 58.0.3029.110 Safari/537.36
  6. Developing new features & standards • Vendors started to propose

    new standards • Working together on new standards • Implement standards, not proprietary technology
  7. IOT

  8. “ The “Web of Things” (WoT) is the idea of

    taking the lessons learned from the World Wide Web and applying them to IoT.
  9. “ Our hope is that this pragmatic approach based on

    proven web technologies like HTTP, REST, JSON, WebSockets and TLS will help turn web developers into WoT developers who can help realize our vision of a decentralized Internet of Things
  10. New APIs and Technologies • PWA Progressive Web Apps •

    Service Workers • Push notifications • Web Bluetooth • Web Assembly • … and many more
  11. Styling section { font-size: 15px; color: #ccc; } h1 {

    font-size: 2em; } .main{ font-size: 4em; } img { width: 100%; } https://hacks.mozilla.org/2017/05/quantum-up-close-what-is-a-browser-engine/
  12. Styling until now Illustrations © by Lin Clark - https://code-cartoons.com/

    https://hacks.mozilla.org/2017/08/inside-a-super-fast-css-engine-quantum-css-aka-stylo/
  13. Styling in Quantum CSS Illustrations © by Lin Clark -

    https://code-cartoons.com/ https://hacks.mozilla.org/2017/08/inside-a-super-fast-css-engine-quantum-css-aka-stylo/
  14. There is more to come • Quantum Dom • Quantum

    Compositor • Quantum Renderer • and more optimizations!
  15. “ A browser engine has to deal with more complicated

    tasks than in 2007 or even earlier
  16. Make the web a better place! • I’m a Developer

    • Keep users in mind! • Profile your page! • Please keep cross browser testing! • https://medium.com/mozilla-tech/keep-the-web-open-with-cross-browser-testing- e3006662a042 • I’m not a Developer! • Report pages which have problems in a specific browser • https://webcompat.com
  17. Make the web a better place! • For everyone •

    Report browser issues! • https://dev.chromium.org/for-testers/bug-reporting-guidelines • https://developer.mozilla.org/en-US/docs/Mozilla/QA/ Bug_writing_guidelines • https://webkit.org/reporting-bugs/ • https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/ • Beta Test new Releases and report issues!