--- title: "This Week's HTML5 and Browser Technology News (Issue 180)" publication: "Frontend Focus" issue: 180 published_at: "2015-03-18" canonical_url: "https://frontendfoc.us/issues/180" --- This Week's HTML5 and Browser Technology News (Issue 180) The Fetch API, the HTML5 AppCache, HTML 5.1 spec, and more. — [Read this e-mail on the Web](http://frontendfoc.us/issues/180) Frontend FocusIssue 180 — March 18, 2015[The Fetch API: The API That's So Fetching](https://hacks.mozilla.org/2015/03/this-api-is-so-fetching/?utm_source=frontendfocus&utm_medium=email) A good introduction to the ‘Fetch API’, an API that aims to fix many of the problems with XMLHttpRequest (the core Ajax technology). HTML5 Rocks also released [an introduction to fetch()](http://updates.html5rocks.com/2015/03/introduction-to-fetch) just the day after if you want a different take. Mozilla Hacks [The Latest, Automatically Released HTML 5.1 Spec](http://www.w3.org/TR/html51/?utm_source=frontendfocus&utm_medium=email) If you want to keep an eye on HTML 5.1, you can now do so in one place. The HTML 5.1 spec is now built with the W3C’s new automated publishing system. W3C [Common Pitfalls to Avoid when using HTML5 AppCache](http://www.sitepoint.com/common-pitfalls-avoid-using-html5-application-cache/?utm_source=frontendfocus&utm_medium=email) The Application Cache enables your visitors to browse your site even when offline. SitePoint [![Thinkful\](https://copm.s3.amazonaws.com/fbd1c8f1.jpg)](http://www.thinkful.com/a/dlp/learn-blue/base/ANG-001?utm_source=html5weekly=html5weekly_march18)[Learn AngularJS Online with 1-on-1 Mentorship](http://www.thinkful.com/a/dlp/learn-blue/base/ANG-001?utm_source=html5weekly=html5weekly_march18)Angular lets you build dynamic, single-page web applications from scratch that are so smooth your users will forget they're still inside a web browser. _Sign up online and start learning today!_ ThinkfulSponsor [Push Notifications on the Open Web](http://updates.html5rocks.com/2015/03/push-notificatons-on-the-open-web?utm_source=frontendfocus&utm_medium=email) As of Chrome version 42, the Push API and Notification API are available to developers. Matt Gaunt digs into how they work complete with code. HTML5 Rocks [Building a Mobile JavaScript Powered Audio Player](http://www.sitepoint.com/building-mobile-javascript-powered-audio-player/?utm_source=frontendfocus&utm_medium=email) Leans on numerous APIs, like the Ambient Light API, Proximity API, Battery Status API, and Vibration API. SitePoint [The Legend of Canvas](https://www.airpair.com/javascript/posts/the-legend-of-canvas?utm_source=frontendfocus&utm_medium=email) A look at how a developer approached recreating Nintendo’s The Legend of Zelda using JavaScript and HTML5, initially using just the DOM, but then later the Canvas. Rich McLaughlin [Media Queries: Width vs. Device Width](http://www.sitepoint.com/media-queries-width-vs-device-width/?utm_source=frontendfocus&utm_medium=email) If you’ve ever been confused of the difference between ‘width’ and ‘device-width’ in CSS media queries, Ryan Reese helps clear it up here. SitePoint [W3C Invites Implementations of Mixed Content](http://www.w3.org/blog/news/archives/4494?utm_source=frontendfocus&utm_medium=email) The W3C and Web Application Security Working Group invite implementation of 'Mixed Content', a specification that aims to improve web security by describing how a user agent should handle fetching of content loaded in a mixed security context. W3C Jobs [![Supported by Hired.com\](http://s3.cooperpress.com.s3.amazonaws.com/hired1.png)](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) - [Freelance with Companies like Airbnb, IDEO JPMorgan](http://www.toptal.com/developers?utm_source=html5_weekly&utm_medium=cpm-newsletter&utm_campaign=html5_weekly_job)Work on special projects with great companies through Toptal. Set your weekly/hourly rate, and work from anywhere in the world as an elite HTML5 developer. See if you have what it takes. TopTal - [Front End Engineer at Yelp!](http://www.yelp.com/careers?jvi=oUOmWfwK,Job)Join Yelp's Front-end team and help build a modern, styleguide-driven UX for our 138 million users! We’re looking for people who love good code and working closely with design, product, and other engineers to make great features. Yelp 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 [CSS Grid Layout Module Level 1 Draft Published](http://www.w3.org/TR/2015/WD-css-grid-1-20150317/?utm_source=frontendfocus&utm_medium=email) news Defines a two-dimensional grid-based layout system, optimized for UI design. W3C ['Experimental support for CSS Filters starting to land in EdgeHTML'](https://twitter.com/IEDevChat/status/574002680386879488?utm_source=frontendfocus&utm_medium=email) news IE Dev Chat [Tumult Releases Hype 3 and Hype Professional with New HTML5 Physics, Responsive Design Tools](http://9to5mac.com/2015/03/18/tumult-hype-3-and-hype-professional/?utm_source=frontendfocus&utm_medium=email) news 9to5Mac [Web MIDI API Working Draft Published](http://www.w3.org/TR/2015/WD-webmidi-20150317/?utm_source=frontendfocus&utm_medium=email) A spec providing users with a bridge between a browser and MIDI-capable devices, like instruments and lights. W3C [A Few Different Ways To Use SVG Sprites In Animation](http://www.smashingmagazine.com/2015/03/17/different-ways-to-use-svg-sprites-in-animation/?utm_source=frontendfocus&utm_medium=email) tutorial Smashing Magazine [Get and Set HTML5 Video Current Time](http://davidwalsh.name/html5-video-current-time?utm_source=frontendfocus&utm_medium=email) tutorial David Walsh [Beyond Blue Links: Making Clickable Elements Recognizable](http://www.nngroup.com/articles/clickable-elements/?utm_source=frontendfocus&utm_medium=email) opinion Nielsen Norman Group [5 Great Uses for Sass Maps](http://www.sitepoint.com/5-great-uses-sass-maps/?utm_source=frontendfocus&utm_medium=email) opinion SitePoint [HTML5 Data Visualization Controls for Mobile Web Development](http://wijmo.com/?utm_source=HTML5%20weeky&utm_medium=3%2F18%20sponsored%20link%20Wijmo%20Data%20Viz&utm_campaign=Wijmo%205) tools Deliver modern apps using the UI controls optimized for both size and speed inside of Wijmo 5. WijmoSponsor [Superpowers: An HTML5 2D+3D Game Maker](https://sparklinlabs.com/?superpowers) tools Not yet open source but they’re running a community fundraiser to make it so. The demo seems nice enough though. Sparklin Labs [How to find and fix the slowest code in your .NET application](http://www.red-gate.com/products/dotnet-development/ants-performance-profiler/?utm_source=html5weekly&utm_medium=displayemail&utm_content=slowest_code&utm_campaign=antsperformanceprofiler&utm_term=email-23346) tools Find bottlenecks in your code or database boost performance with new ANTS Performance Profiler 9. Try free. Red Gate SoftwareSponsor [A Portfolio Site Made Entirely with HTML5 Canvas](http://ericlesch.com/?utm_source=frontendfocus&utm_medium=email) demo Eric Lesch [Infinite String Quartet](http://infinitestringquartet.com/?utm_source=frontendfocus&utm_medium=email) demo A little odd, you drag circles onto a field and sounds begin.. [A 3D Isometric Tile System in SVGs](http://codepen.io/AshKyd/pen/zxmgzV?utm_source=frontendfocus&utm_medium=email) code demo CodePen [Textures.js: SVG Patterns for Data Visualization](http://riccardoscalco.github.io/textures/?utm_source=frontendfocus&utm_medium=email) code [trim-html: Cutting HTML Strings without Breaking the HTML](https://github.com/brankosekulic/trimHtml?utm_source=frontendfocus&utm_medium=email) code Node/JavaScript code. Branko Sekulic [CopperLicht 1.9: Open Source JavaScript 3D Engine using WebGL](http://www.ambiera.com/copperlicht/?v=1.9) code Ambiera [type.js: Remedying CSS’s Typographic Oversights](https://github.com/nathanford/type.js?utm_source=frontendfocus&utm_medium=email) code Adds new properties to your (embedded) CSS giving extra control over type in areas like kerning and widows. Nathan Ford 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/180) Cooper Press Ltd. Office 30, Lincoln Way, Louth, LN11 0LS, UK