---
title: "This Week's HTML5 and Browser Technology News (Issue 236)"
publication: "Frontend Focus"
issue: 236
published_at: "2016-04-20"
canonical_url: "https://frontendfoc.us/issues/236"
---
This Week's HTML5 and Browser Technology News (Issue 236)
[Read this e-mail on the Web](http://frontendfoc.us/issues/236)
Frontend FocusIssue 236 — April 20, 2016[Flexbox Patterns: User Interface Examples with Code](http://www.flexboxpatterns.com/home?utm_source=frontendfocus&utm_medium=email)Some interactive examples showing practical ways to use Flexbox to build UI components for your own site, along with code you can use. CJ Cenizal
[CSS within JavaScript? Meet CSSX](https://www.smashingmagazine.com/2016/04/finally-css-javascript-meet-cssx/?utm_source=frontendfocus&utm_medium=email)Facebook introduced JSX, in which HTML markup is mixed in with JavaScript. What about if we did the same with CSS? Here's a thorough look at one option. Krasimir Tsonev
[Web Font Loading Patterns](https://www.bramstein.com/writing/web-font-loading-patterns.html?utm_source=frontendfocus&utm_medium=email)Use these font loading patterns and Web font loading will become a lot simpler. Combine the patterns to create custom loading behaviour for all browsers. Bram Stein
[](https://2016.fullstackfest.com/call-for-papers?utm_source=frontendfocus&utm_medium=email)[CFP for Barcelona Full Stack Fest 2016 has opened. Join us and inspire your peers.](https://2016.fullstackfest.com/call-for-papers?utm_source=frontendfocus&utm_medium=email)A week-long full stack development conference with a focus on solving current problems with new & inspiring perspectives. Our Call For Papers is open with 16 speaker slots. Submit your talk before the 14th of May and join us in Barcelona! Full Stack FestSponsor
[A Tour of Edge's F12 Developer Tools](https://channel9.msdn.com/Events/WebPlatformSummit/edgesummit2016/ES1610?utm_source=frontendfocus&utm_medium=email)A look at some of the new features in Edge’s ‘F12’ developer tools and how they can make your life as a developer easier with a practical look at fixing real world issues with them. Andy Sterland
[Service Workers Replacing AppCache: A Sledgehammer to Crack A Nut?](https://medium.com/@firt/service-workers-replacing-appcache-a-sledgehammer-to-crack-a-nut-5db6f473cc9b?utm_source=frontendfocus&utm_medium=email)“Can we replace Application Cache with Service Workers? Yes we can. In the same way we can replace your old CRT TV with a Microsoft Hololens.” Maximiliano Firtman
[Multiple.js: Sharing A Background Over Multiple Elements](https://nexts.github.io/Multiple.js/?utm_source=frontendfocus&utm_medium=email)Billed as ‘an experiment in sharing background across multiple elements using CSS’, the creator takes a fun approach to explaining how it works. Denis Lukov
[Argus Eyes: A CLI Tool for Visual Regression Testing](http://arguseyes.io/?utm_source=frontendfocus&utm_medium=email)It takes screenshots of components on Web pages under different situations (branches, pages, etc.) and visually diffs them. Argus Eyes
[Looking Back on One Year of Microsoft Edge](https://channel9.msdn.com/Events/WebPlatformSummit/edgesummit2016/ES1601?utm_source=frontendfocus&utm_medium=email)Reflections on the progress of MSFT's “first new browser in 20 years”: Edge. Channel 9
Jobs [](https://hired.com/join/?utm_source=petercooperpress&utm_medium=sponsor&utm_campaign=%28b2c%29%28l-all%29%28r-swe%29%28q2-17-frontend-focus%29&utm_content=newsletter)
- [JavaScript/HTML5 Developer at Evolution Gaming](https://www.evolutiongaming.com/jobs/javascripthtml5-developers-mobile-games?utm_source=frontendfocus&utm_medium=email)We are looking for a senior developer who would be ready to shape the future and accomplish challenging tasks, e.g., migrating stateful legacy components to functional React-Redux ones and modularising CSS with the help of css-modules. Evolution Gaming
- [The Easiest Way to Find a Job](https://hired.com/?utm_source=newsletters&utm_medium=petercooperpress&utm_term=cat-tech-html5&utm_content=easiest&utm_campaign=q2-16-html5weekly&utm_location=us)Hired lets you sit back while job offers come to you. When you complete your profile, instantly apply to 3,500+ companies on the platform who will contact you with job offers, including salary and equity up-front. [Try it today.](https://hired.com/?utm_source=newsletters=petercooperpress=cat-tech-html5=easiest=q2-16-html5weekly=us) Hired.com
- [Front-End Developer at Adaptable (Birmingham, UK)](http://frontenddeveloperjob.com/job/57160be3ec576f000367cfb2?utm_source=frontendfocus&utm_medium=email) Adaptable
Can't find the right job? Want companies to apply to _you?_ [Try Hired.com.](https://hired.com/?utm_source=newsletters&utm_medium=petercooperpress&utm_term=cat-tech-frontend&utm_campaign=q2-17-frontend)
In Brief
[New in Chrome 50: Payload in Push, Preload Assets & More](https://www.youtube.com/watch?v=jeBP-BFhkbM&list=PLNYkxOF6rcIDfz8XEA3loxY32tYh7CI3m) news video
YouTube
[Preview Plugin-Free Skype Video Calling in Microsoft Edge](https://blogs.windows.com/msedgedev/2016/04/15/preview-plugin-free-skype-video-calling-in-microsoft-edge/?utm_source=frontendfocus&utm_medium=email) news
Powered by the ORTC API.
Kyle Pflug
[WebM, VP9 and Opus Support in Microsoft Edge](https://blogs.windows.com/msedgedev/2016/04/18/webm-vp9-and-opus-support-in-microsoft-edge/?utm_source=frontendfocus&utm_medium=email) news
The WebM container format and the VP9 video and Opus audio codecs are supported in the latest Edge.
Microsoft Edge Team
[WebUSB: Enabling Support for Web Access to USB Devices](https://groups.google.com/a/chromium.org/d/msg/blink-dev/i6wQ7PNuMyc/eGfTKYsiAwAJ?utm_source=frontendfocus&utm_medium=email) news
The Chrome team are experimenting with allowing webapps to access USB devices.
Google Groups
[Building The UI for The New 'The Times' Site](https://medium.com/@peduarte/building-the-ui-for-the-new-the-times-website-26dc4e6569e?utm_source=frontendfocus&utm_medium=email) news
Pedro Duarte
[Free Webinar - How to Launch A Career In Software Development](https://launchschool.com/blog/how-to-launch-a-career-in-software-development?utm_source=html5%20weekly&utm_medium=email&utm_campaign=How%20to%20Launch%20a%20Career%20in%20Software%20Development) rawurl course
Learn what it takes to become a professional software developer, what employers are looking for, and how to make the transformation.
Launch SchoolSponsor
[Embedding Virtual Reality Across The Web with VR Views](http://www.sitepoint.com/embedding-virtual-reality-across-the-web-with-vr-views/?utm_term=embedding%20VR%20on%20the%20web%20using%20VR%20views) tutorial
How to use Google’s new VR Views to embed VR content on your website.
Patrick Catanzariti
[Webpack — The Confusing Parts](https://medium.com/@rajaraodv/webpack-the-confusing-parts-58712f8fcad9?utm_source=frontendfocus&utm_medium=email) tutorial
Raja Rao
[Better CSS Drop Caps with 'initial-letter'](http://webdesign.tutsplus.com/tutorials/better-css-drop-caps-with-initial-letter--cms-26350?utm_source=frontendfocus&utm_medium=email) tutorial
Ian Yates
[An In-Depth Typi Tutorial (a Sass Mixin for Easier Responsive Typography)](http://zellwk.com/blog/typi/?utm_source=frontendfocus&utm_medium=email) tutorial
Zell Liew
[Data Types in Sass](http://www.sitepoint.com/data-types-in-sass/?utm_source=frontendfocus&utm_medium=email) tutorial
Gajendar Singh
[The SaveAs Webinar: Exporting Content from JavaScript Apps](http://www.telerik.com/campaigns/kendo-ui/exporting-js-content?utm_medium=newsletter&utm_source=HTMLWeekly&utm_campaign=dt-kendo-apr16-webinar-export) rawurl tutorial
Implementing export functionality in your web apps presents a multitude of challenges. Learn how to tackle them.
Telerik Kendo UISponsor
[Building Extensions for Microsoft Edge](https://channel9.msdn.com/Events/WebPlatformSummit/edgesummit2016/ES1614?utm_source=frontendfocus&utm_medium=email) video
Channel 9
[How We Use BEM to Modularize Our CSS](https://m.alphasights.com/how-we-use-bem-to-modularise-our-css-82a0c39463b0?utm_source=frontendfocus&utm_medium=email) opinion
A look at the ‘Block Element Modifier’ approach that provides a methodical way to arrange CSS classes into independent components.
Andrei Popa
[Spectre.css: A Lightweight and Responsive CSS Framework](http://picturepan2.github.io/spectre/?utm_source=frontendfocus&utm_medium=email) code
Includes a flexbox-based responsive grid system.
Yan Zhu
[Bricklayer: A Lightweight, Cascading Grid Layout Library](https://github.com/ademilter/bricklayer?utm_source=frontendfocus&utm_medium=email) code
Adem ilter
[Atrament.js: For Smooth Drawing and Handwriting on HTML Canvas](https://github.com/jakubfiala/atrament.js?utm_source=frontendfocus&utm_medium=email) code
Jakub Fiala
[CSS Only iPhone 6 Mockup](http://codepen.io/havardob/pen/KzoOMB?utm_source=frontendfocus&utm_medium=email) code
Håvard Brynjulfsen
Curated by [Peter Cooper](http://twitter.com/peterc) and [Chris Brandrick](http://twitter.com/chrisbrandrick) and published by [Cooperpress](https://cooperpress.com/).
[Stop getting FrontEnd Focus](*|UNSUB|*) : [Change email address](*|UPDATE_PROFILE|*) : [Read this issue on the Web](http://frontendfoc.us/issues/236)
Cooper Press Ltd. Office 30, Lincoln Way, Louth, LN11 0LS, UK