Frontend Focus

Issue 299 — July 19, 2017
A practical guide to the relatively complex world of WebRTC, a set of real-time communications mechanisms that can be useful for things like voice and video chat, file transfers, chat, etc.
A thorough guide to things you need to consider when creating ‘slider’ UI elements.
Vitaly Friedman
Jens argues that CSS resets achieve what devs “often do anyway” adding that the same result can be acheived “with one or two declarations instead of an entire extra style sheet”.
Jens Oliver Meiert

Technical knowledge alone isn’t enough—increase your income by leveling up your “soft skills.” Learn new skills faster, command more respect, find work you love, and earn what you’re worth. Get the book for $0.99 (48 hours only).
Simple Programmer
Sass now fully supports CSS custom properties (more info here), first class functions, bracketed lists, and the ::slotted pseudo-element.
Natalie Weizenbaum
Key pointers on how to establish a practical approach to performance, what to measure, and how to set goals.
David Gilbertson
“a good bit has changed in browser land since the last ‘You Might Not Need jQuery’ article you might have stumbled upon”
Ollie Williams
Cross-platform and supporting Chrome, Firefox, PhantomJS, TagUI lets you create natural-language style scripts for performing Web actions.


Can’t find the right job? Want companies to apply to you? Try

In Brief

Reducing CSS Bundle Size 70% tutorial cutting the class names and using scope isolation.
Gajus Kuizinas

Advanced SCSS, or 16 Cool Things You May Not Have Known Your Stylesheets Could Do tutorial
Jarno Rantanen

Introduction to Clipping Out Shapes with CSS’s `clip-path` tutorial

Webpack’s import() Will Soon Fetch JS + CSS — Here’s How You Do It tutorial
James Gillmore

How to Use CSS Variables for Animation tutorial
Dennis Gaebel

Creating a Cut-Out ‘Sticky Tape’ Effect for Images with SVG and CSS tutorial
Ana Tudor

Building Better Backgrounds tutorial
Approaches to stacking CSS background images on mobile for improved readability, using object-fit and ES2015+.
Zack Cote

Responsive Typography using calc(), vw, and Sass Superpowers tutorial
How to precisely scale text as the viewport expands and contracts.
Nate York

Add interactive features to your site in minutes 
With features like in-app notifications, real-time dashboards and multi-user collaboration. Start for free, with a few lines of code.
Pusher  Sponsor

What I Learned About Vue.js from Building a Chrome Extension story
vuejs developers

Evergreen Websites for Evergreen Browsers video
Rachel’s talk from this year’s Fluent conf, covering CSS Grid, Feature Queries, Exclusions and more.
Rachel Andrew

What’s New in Chrome 59? video
Take a look at the new features of Chrome 59 (e.g. Headless Chrome). Filmed at Ember London.
Will Raxworthy

Musings on HTTP/2 and Bundling opinion
Jeremy Wagner

Troubleshoot slow web apps with Datadog tools
Get alerts for performance problems and find the bottleneck in your application with end-to-end request tracing.
Datadog  Sponsor

Introducing the Website Speed Test Image Analysis Tool tools
Eric Portis

DoppioJVM: A JVM in 100% JavaScript code

raf-schd: A Scheduler Based on requestAnimationFrame code
Alex Reardon

Babylon.js 3.0: A Framework for Building 3D Experiences code
Here’s a demo of it in action.
David Catuhe

Source link