---
title: "An Inside Look at a Modern Web Browser"
publication: "Frontend Focus"
issue: 358
published_at: "2018-09-19"
canonical_url: "https://frontendfoc.us/issues/358"
---

This Week's HTML5, CSS, Browser, and Frontend News       

#358 — September 19, 2018 

[Read on the Web](https://frontendfoc.us/issues/358)   

Frontend Focus 

[![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60/q9e1ewsi3t8xjhdjl4ea.jpg)](https://blog.mozilla.org/blog/2018/09/18/firefox-reality-now-available/)  

[Firefox Reality: Mozilla's 'Mixed Reality' Browser](https://blog.mozilla.org/blog/2018/09/18/firefox-reality-now-available/) — _Reality_ is an intriguing new browser being built by the mixed reality team at Mozilla to explore using the Web in VR and mixed reality contexts. A first release is now available in the Vive, Oculus, and Google Daydream app stores. 

The Mozilla Blog   

[An Inside Look at a Modern Web Browser (Chrome, Specifically)](https://developers.google.com/web/updates/2018/09/inside-browser-part1) — A fantastically illustrated four part series (two parts are up so far - [part 2 here](https://developers.google.com/web/updates/2018/09/inside-browser-part2)) digging into Chrome’s architecture and how it ultimately renders code into functional sites. 

Mariko Kosaka   [![\](https://copm.s3.amazonaws.com/544ef959.png)](https://app-frankfurt.salesforceiq.com/r?target=5b98ceb94cedfd00791b749b&t=ABb3-Af8mVuLuG-hrzQ5Z_ExN-ffs-Ciz_CT0TMYCXj1Kgcla2hB53S0iEFr4q26KMWsJykde2342BViPKroQ6z14RRrCVHU_NE563iZ6NYcXRJWW469Lsg_Y1kvU3PrbAYqiJ_dPBzS&url=https%3A%2F%2Fwww.contentful.com%2Ffeatures%2F%3Futm_medium%3Demail%26utm_source%3Dpromotion%26utm_campaign%3Dfrontend-focus-newsletter) 

[The Content Infrastructure for All Your Web Project Needs](https://app-frankfurt.salesforceiq.com/r?target=5b98ceb94cedfd00791b749b&t=ABb3-Af8mVuLuG-hrzQ5Z_ExN-ffs-Ciz_CT0TMYCXj1Kgcla2hB53S0iEFr4q26KMWsJykde2342BViPKroQ6z14RRrCVHU_NE563iZ6NYcXRJWW469Lsg_Y1kvU3PrbAYqiJ_dPBzS&url=https%3A%2F%2Fwww.contentful.com%2Ffeatures%2F%3Futm_medium%3Demail%26utm_source%3Dpromotion%26utm_campaign%3Dfrontend-focus-newsletter) — Don’t want to set up and maintain a CMS but still have to give your colleagues a way to edit or manage content on your site? Contentful can help you with a scalable content infrastructure, array of modern APIs and a customizable editorial experience. 

Contentful sponsor   

[Web Audio API is Now a W3C Candidate Recommendation](https://www.w3.org/TR/webaudio/) — Supported in [almost every browser](https://caniuse.com/#feat=audio-api), the Web Audio API spec is now a fundamental part of the Web. [Some demos](http://webaudiodemos.appspot.com/), if you haven’t played with it for a while. 

W3C   

[The AMP Project's New Open Governance Model](https://amphtml.wordpress.com/2018/09/18/governance/) — The AMP project has faced a lot of criticism for how it’s helping to reshape the Web, so they’re opening things up a bit with official representation from more companies and open web advocates. 

Accelerated Mobile Pages Project   

[Chrome 70 Beta and the Shape Detection API](https://blog.chromium.org/2018/09/chrome-70-beta-shape-detection-web.html) — The [Shape Detection API](https://paul.kinlan.me/barcode-detection/) consists of three other APIs, the Face Detection API, Barcode Detection API and Text Detection API, all designed to make a device’s shape detection capabilities available to Web developers. 

Google   

[Flexbox: How Big Is That Flexible Box?](https://www.smashingmagazine.com/2018/09/flexbox-sizing-flexible-box/) — Explores the often confusing issue of sizing in Flexbox. _How does Flexbox decide how big things should be?_ 

Rachel Andrew   

[What Makes a Good Frontend Developer?](https://css-tricks.com/what-makes-a-good-front-end-developer/) — 10 front-end developers, some of who you may know, answer the question. 

Chris Coyier  

💻 Jobs  

[Sr. Front End Engineer - Web Animations (San Diego/Remote)](https://www.mjdinteractive.com/careers/senior-front-end-engineer-2/) — You enjoy finding cool designs on Dribbble and making them a reality. You have an online profile with some rad CSS and JS animations. 

MJD Interactive   

[Try Vettery](https://www.vettery.com/tech?utm_source=newsletter&utm_medium=cooper-frontendfocus&utm_term=tech&utm_content=grouped&utm_campaign=ad-77580) — Create a profile to connect with inspiring companies seeking FrontEnd devs. 

Vettery  

📘 Tutorials  

[Building Donut Progress Charts with Chrome's New Conical Gradients](https://blog.logrocket.com/new-in-chrome-69-building-progress-doughnut-charts-with-conical-gradients-356820b1d081) — Support for `conic-gradient` is currently [limited](https://caniuse.com/#feat=css-conic-gradients) to Chrome 69+. 

Facundo Corradini   

[The Low Hanging Fruit of Web Performance](http://mediatemple.net/blog/tips/low-hanging-fruit-web-performance/) — A collection of some “fairly easy to do” performance-increasing tactics that have noticable returns. 

Chris Coyier   

[Create a Serverless Powered API in 10 Minutes](https://www.cloudflare.com/lp/workers/serverless-powered-api/?utm_source=Workers&utm_medium=Display&utm_campaign=Cooperpress_Serverless_API_LP) 

Cloudflare sponsor   

[Control Page Scroll in CSS Using Scroll Snapping](https://alligator.io/css/scroll-snapping/) 

Alligator   

[Asynchronous Access to HTTP Cookies](https://developers.google.com/web/updates/2018/09/asynchronous-access-to-http-cookies) — The Cookie Store API is available for Origin Trials starting in Chrome 69. 

Victor Costan (Google)   

[How Browser Rendering Works, Behind the Scenes](https://blog.logrocket.com/how-browser-rendering-works-behind-the-scenes-6782b0e8fb10) — A high level walkthrough of how browsers operate. 

Ohans Emmanuel   

[In New York We Are Doing Live Sessions Again. Get 100 USD Off](http://smashed.by/frontendfocustickets) 

SMASHINGCONF NYC sponsor   

[Updating a CSS Variable with JavaScript](https://css-tricks.com/updating-a-css-variable-with-javascript/) 

Chris Coyier  

🔧 Code and Tools  

[WWWBasic: An Implementation of BASIC for the Web](https://github.com/google/wwwbasic) — Forget Chrome or Golang, this is surely Google’s defining product of the moment. 

Google   

[Pa11y: An Automated Accessibility Testing Tool](https://github.com/pa11y/pa11y) — Something you can add into your build process. 

Pa11y   

[The Most Innovative Businesses Are Deploying Apps on DigitalOcean](https://try.digitalocean.com/businesses/?utm_source=paid_newsletter+frontend+weekly&utm_medium=display&utm_campaign=2018_Brand&utm_content=9-19-18+frontend+weekly+cooperpress) — Experience the developer-friendly cloud platform today with a free $100 credit toward your first project. 

DigitalOcean sponsor   

[Panther: A Browser Testing and Web Crawling Library for PHP](https://github.com/symfony/panther) — Uses the W3C’s WebDriver protocol to drive native browsers from PHP. 

Symfony   

[A Few Lines of CSS That Can Restart an iPhone](https://twitter.com/pwnsdx/status/1040944750973595649) — A security researcher has found a vulnerability in WebKit that can crash an iPhone or iPad. 

Sabri on Twitter   

[Workbox: A Collection of JavaScript Libraries for Progressive Web Apps](https://github.com/GoogleChrome/workbox) — [v3.5.0](https://github.com/GoogleChrome/workbox/releases/tag/v3.5.0) just came out. 

Google         

A **[Cooperpress](https://cooperpress.com/)** publication. 

[Change your email address](https://frontendfoc.us/edit_subscription/*|UID|*) or[Stop getting this newsletter](https://frontendfoc.us/leave/*|UID|*) 

© Cooper Press Ltd · Fairfield Enterprise Centre, Louth, LN11 0LS, United Kingdom