This Week's HTML5 and Browser Technology News (Issue 254)

Read this e-mail on the Web FrontEnd Focus formerly HTML5 Weekly A Case Study on Boosting Front-End Performance CSS Tricks Declan Rek shares real-world advice on boosting front-end performance from static site generation and the picture element to lazy loading CSS and caching. A 40 Minute Deep Dive Into the IFRAME Element Peter van der Zee How IFRAMEs are used, where they came from, and what the specs have to say. Using Feature Queries in CSS Jen Simmons Using @supports, you can include a small test in your CSS for whether or not a particular CSS property or value is supported and apply styles conditionally. New Course: Complete Intro to React (feat. Redux & Router) Frontend Masters  Sponsored Brian Holt (Netflix) introduces you to React plus surrounding ecosystem including: Redux for state management, React Router for navigation and more! How To Use WebPageTest and its API Eduardo Bouças A handy tutorial digging into WebPageTest, a site speed test tool, its RESTful API, and how to use it optimize your own sites. 8 Clever Tricks with CSS Functions Anselm Urban Some neat tricks you can use today in CSS, from fancy CSS animations and a frosted glass effect, to using calc() for grids and aligning with position:fixed items. Flexible Typography Formula with CSS Locks Tim Brown Adobe Typekit’s Head of Typography shares some interesting ideas on dynamically calculating typography variables (e.g. font size or line heights) independent of media query breakpoints. An Introduction to CSS Grid's 'fr' Unit Rachel Andrew A quick 2 minute video intro to a new unit in the CSS Grid Layout Module - the ‘fr’ unit which represents a fraction of the available space. Jobs 29 Front End Developer JobsOur free front-end developer job site currently including frontend jobs from as far afield as Zurich and Malaysia to London and Silicon Valley. Cooper Press Stop Applying to Jobs - Let Companies Come To YouOn Hired, engineers typically get 5+ job offers in 1 week. Find that new opportunity you've been craving and get access to 4,000+ companies instantly. Hired.com In brief Flash Is Dying in December: Long Live HTML5 Video Player news “TL;DR: if you play HLS, it’s time to add MSE playback.”  Hadar Weiss Micropub is Now a W3C Candidate Recommendation news  Aaron Parecki Polymer Summit 2016 Arrives in London on 17-18 October 2016 news The Polymer Summit returns to the Tobacco Dock, London for two full days of talks, codelabs, and breakout sessions from the Polymer team and major companies using Polymer and web components in production.  Google, Inc. SPONSOR Using CSS3 Counters for Figure and Table Numbering tutorial  Olivier Pieters A Few HTML Tips tutorial  Mozilla Hacks Bootstrapping Progressive Web Apps with amp-install-serviceworker tutorial How to build a seamless bridge between AMP pages and Progressive Web Apps with amp-install-serviceworker.  Ruadhán O'Donoghue How to Use the Module Pattern in your SCSS/Sass Stylesheets tutorial  Marc Mintel `font-display` for The Masses tutorial font-display is a new CSS property for controlling how Web fonts display.  CSS Tricks Auditing the US Presidential Candidates Websites for Accessibility story Making web accessibility great again: An accessibility audit on Hillary Clinton’s and Donald Trump’s campaign websites.  Helena Zubkow Mike Herchel Offline Content with Service Workers story A look down the ‘deep rabbit hole’ of how powerful and versatile service workers are for delivering offline content.  Mike Riethmuller A Web Audio Experiment: Detecting Piano Notes story demo  David Gilbertson Headings and Semantic Structure for Accessible Web Pages video  Marcy Sutton Getting Started with CSS Transitions video Very simple 2 minute video.  Channel 9 Photoshop Etiquette For Responsive Web Design opinion  Dan Rose Lightning fast SSD hosts for your HTML5 project tools Host your HTML5 site on Linode servers - the fastest VPS hosts available. Use promo code HTML520 for $20 credit.  Linode SPONSOR Surfingkeys: Expand Your Browser with JavaScript + Keyboard tools Write JS to do things in the browser when triggered by the keyboard.  Brook Hong 25 Essential Chrome Extensions for Web Designers tools A good round-up of tools for devs and designers.  Paul Andrew Push.js: JavaScript Notifications for (Almost) Every Browser code  Tyler Nickerson Animate.js: A Tiny Script to Trigger Animations on Elements When They're Within The Viewport code  Josh Johnson Curated by Peter Cooper and published by Cooper Press. Unsubscribe : Change email address : Read this issue on the Web Published by Cooper Press Ltd. Fairfield Enterprise Centre, Louth, LN11 0LS, UK

by via FrontEnd Focus