The digest of fresh materials from the world of the frontend for the last week №274 (August 1 - 6, 2017)

We offer you a selection with links to new materials from the front-end area and around it.

Web development

CSS

Javascript

Browsers

Entertaining

Media

• Podcast "Web Standards", Issue # 79 : Service workers are no longer a joke, font download, grids and flexes, picture in practice, heavy packages, WTF JS?
• Podcast "Frontend Weekend" # 14 : From freelancing to our own school of online education
• Five Minute React podcast # 28 : React 16 Beta
• Five Minute React podcast # 29 : Monitoring bugs (youtube version with video and presentation slides)
• Podcast «Drinkcast» №2 : Vibrant June - Happy Mentor
• Podcast "Frontend Youth (18+)" # 12 : Where to work in zashkvarno
• Podcast "Frontend Youth (18+)" # 13 : Good / Bad Programmer
• Outside fonts - HTML Shorts . How to download fonts correctly? Vadim Makeev about FOIT, FOUT, FOFT and Font Face Observer
• Weekly stream from Yuri Artyukh “ALL YOUR HTML” # 10 : Yuri plays a game of Code In The Dark, makes a watercolor effect and triangulation for future animations

Web development

• Beginner's Guide to Progressive Web Applications and the Frontend
• 7 Tools to Design Your First Progressive Web Application
• Adaptive Images 201: Client Hints Technology
• Simplify working with npm: useful abbreviations and tricks
• 10 guides to improve web accessibility
• Replaced elements in HTML: myths and reality
• I made a styling for my personal site and you should too . A fresh note from Zach Leatherman
• Performance:
  
  
  • Difference between GTmetrix, PageSpeed ​​Insights, Pingdom Tools and WebPagetest
  • Critical request . Detailed article on the features of downloading various types of content, with priorities, examples and check list
  • “First Significant Rendering” , Patrick Hamann's talk at Front-Trends 2017
  • " Render performance on the contrary" Martin Splitt on Front-Trends 2017 with a look at the sites in terms of computer graphics
  
  
• Spectacular web:
  ')
  
  • Weekly selection of beautiful effects on CSS / SVG / JS # 47
  • Comparing time on Vue (+ SVG, GSAP and .toLocaleTimeString)
  • Creative animation for mouse over menu effects.
  • Transition effects for full-screen page layouts
  • SVG Parallax Animation Tools

CSS

• Unified Style Language
• emotion: Next Generation CSS-in-JS
• Top 9 libraries for animation in 2017
• Focusing on focus . About: focus,: focus-ring and availability
• If you really don't like FOUT, `font-display: optional` can help you.
• Shoelace - a starting set of customizable styles in the spirit of bootstrap, but with a modern twist
• Getting rid of the ugly state: focus (as well as saving it)
• Glamorous v4 release
• How to use custom CSS properties with transitions, transformations and animations
• "Master Fallback for Web Font" , a fresh video from the Front End Center
• The Power of CSS , Una Kravets talk at Front-Trends 2017

Javascript

• Javascript as a phenomenon , javascript as a holiday , javascript as thought virus
• Hidden messages in JavaScript property names
• New V8 and Node.js speed: optimization techniques today and tomorrow
• The release of JavaScript engine V8 6.1
• Online VS Code IDE for Angular and React.
• Road to modern javascript
• Vue vs React: a battle of javascript frameworks
• What the f * ck javascript? . Supervised list of fun and tricky JavaScript examples for fun
• Your latest eslint config . The next one will be with Prettier
• JavaScript Riddles for Fun and Benefit - Dan Shappir
• Javascript popup
• Creating a library for the Image Zoom effect on vanilla JavaScript
• Oh yeah! Async / Await
• VueJS:
  
  
  • Performance Audit Vue.js docs
  • Nuxt.js: a framework for creating universal Vue.js applications
  • Creating custom inputs on Vue.js
  • Binding classes to HTML using Vue.js
  • How to create a photo gallery on Vue.js
  • vuestic - Admin dashboard for Vue.js applications
  
  
• React:
  
  
  • How to close a web application on a bunch of React and Redux in 10 minutes
  • TDD React.js applications
  • Learning React.js is easier than you think.
  • Deep immersion in React animation
  • hocs - a collection of high-level components for React
  • Introduction to React Router
  • React.JS - data transfer in components
  • Prototyping with React VR
  
  
• Angular:
  
  
  • What's New in Angular 5: Simplified Work with Progressive Web Applications
  • Comparison between: Angular 1 Vs Angular 2 Vs Angular 4
  • Key Angular Application Development Concepts
  • Angular CSS status
  • Optimize the performance of your Angular application

Browsers

• Firefox begins testing file uploads, voice input and notes
• Mozilla developers are testing a tool to transfer deleted files after uploading.
• Chrome Android build builds an ad blocker in test builds
• Another extension for Chrome turned into adware by hacking its developer
• Intersection Observer comes to Firefox
• Facebook has joined Chromium
• Machine learning penetrates browsers using javascript

Entertaining

• Flash is dead: who's next?
• Publishers come back to WordPress after short experiments with Medium.
• WebAssembly (W3C) Working Group Launched
• webpack awarded $ 125,000 by MOSS (Mozilla)
• Why startups fail: analysis of the reasons given by the founders of 194 companies
• Fork Bitcoin Cash in the Bitcoin network officially took place
• More than $ 3000: Bitcoin has updated the historical maximum and continues to grow
• Facebook now uses neural networks for translation
• What is happening on the Internet per minute in 2017 (infographics)

We apologize for any typos or broken / duplicate links. If you notice a problem - please write in a personal, we are trying to fix them quickly.

← Digest last week
Material prepared by dersmoll and alekskorovin