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

We bring to your attention a selection with links to new materials from the frontend area and around it.

Web development

CSS

Javascript

Browsers

Entertaining

Media

• Podcast “Web Standards”, Issue No. 79 : Service workers are no longer a joke, downloading fonts, grids and flexes, picture in practice, heavy packages, WTF JS?
• Frontend Weekend Podcast # 14 : From Freelance to Your Own Online Education School
• React Five Minute Podcast # 28 : React 16 Beta
• React Five Minute Podcast # 29 : Error Monitoring (youtube version with video and presentation slides)
• Drinkcast Podcast # 2 : Joyful June - Happy Mentor
• Podcast “Frontend Youth (18+)” # 12 : Where to work hard
• Podcast “Frontend Youth (18+)” # 13 : Good / Bad Programmer
• Foreign fonts - HTML Shorts . How to download fonts? Vadim Makeev about FOIT, FOUT, FOFT and Font Face Observer
• Weekly stream from Yuri Artyukh “ALL YOUR HTML” # 10 : Yuri plays played in Code In The Dark, makes a watercolor effect and triangulation for future animations

Web development

• Beginner's Guide to Advanced Web Applications and Front Ends
• 7 tools to develop your first progressive web application
• Responsive Images 201: Client Hints Technology
• Making npm easier: useful cuts and tricks
• 10 guides to improve web accessibility
• Replaceable Elements in HTML: Myths and Reality
• I made a style guide for my personal site and you should too . Fresh Note from Zach Leatherman
• Performance:
  
  
  • Difference between GTmetrix, PageSpeed ​​Insights, Pingdom Tools and WebPagetest
  • Critical request . A detailed article about the features of downloading various types of content, with priorities, examples and a checklist
  • “First significant rendering,” a report by Patrick Hamann at Front-Trends 2017
  • “ Rendering performance vice versa” Martin Splitt at Front-Trends 2017 with a look at sites in terms of computer graphics
  
  
• Spectacular web:
  
  
  • Weekly compilation of beautiful effects on CSS / SVG / JS # 47
  • Vue time comparison (+ 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: The Next Generation of CSS-in-JS
• Top 9 animation libraries in 2017
• Focus on focus . About: focus,: focus-ring and accessibility
• If you really don't like FOUT, `font-display: optional` can help you
• Shoelace - a starting set of custom styles in the spirit of bootstrap, but in a modern way
• Getting rid of an ugly state: focus (as well as saving it)
• Glamorous v4 release
• How to use custom CSS properties with transitions, transforms, and animations
• “Master fallback for web font” , a fresh video from Front End Center
• The Power of CSS , Una Kravets report at Front-Trends 2017

Javascript

• JavaScript as a phenomenon , JavaScript as a celebration , JavaScript as a thought virus
• Hidden Messages in JavaScript Property Names
• New V8 and Node.js Speed: Optimization Techniques Today and Tomorrow
• V8 6.1 JavaScript Engine Release
• Online VS Code IDE for Angular and React.
• The Road to Modern JavaScript
• Vue vs React: the battle of Javascript frameworks
• What the f * ck javascript? . A curated list of fun and tricky JavaScript fun examples
• Your latest ESLint config . The next one will be with Prettier
• Jigsaw Puzzles for Fun and Use - Dan Shappir
• JavaScript Bubbling
• Creating a library for the Image Zoom effect on vanilla JavaScript
• Oh yeah! Async / await
• VueJS:
  
  
  • Performance audit of 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 deploy React and Redux web application 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
  • Прототипирование с React VR
  
  
• Angular:
  
  
  • Что нового в Angular 5: упрощена работа с прогрессивными веб приложениями
  • Сравнение между: Angular 1 Vs Angular 2 Vs Angular 4
  • Ключевые концепции разработки приложений на Angular
  • Состояние CSS в Angular
  • Оптимизация производительности вашего Angular приложения

Браузеры

• В Firefox началось тестирование отправки файлов, голосового ввода и заметок
• Разработчики Mozilla тестируют инструмент для передачи уничтожающихся после загрузки файлов
• В тестовых сборках Chrome для Android появился встроенный блокировщик рекламы
• Еще одно расширение для Chrome превратили в adware, взломав его разработчика
• Intersection Observer приходит в Firefox
• Facebook присоединился к Chromium
• Машинное обучение проникает в браузеры с помощью JavaScript

Занимательное

• Flash мертв: кто следующий?
• Publishers returning to WordPress after short experimentation with Medium
• WebAssembly (W3C) Working Group Launched
• webpack awarded $ 125,000 by MOSS (Mozilla)
• Why startups fail: an analysis of the reasons cited by the founders of 194 companies
• Bitcoin Cash fork in the Bitcoin network officially held
• Over $ 3,000: Bitcoin rate updated historic highs and continues to grow
• Facebook now uses neural networks for translation
• What happens on the Internet per minute in 2017 (infographic)

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

← Digest last week
Material prepared dersmoll and alekskorovin