The digest of fresh materials from the world of the front-end for the last week No. 265 (May 29 - June 4, 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

Web development

• Overview of changes in the new major release of Node 8
• Podcast Web Standards, Issue No. 71 : Safari TP, calendar, development on the phone, grids in practice, custom properties, label magic, in-depth flexes, Node.js and npm, CSS-in-JS.
• npm @ 5 now npm @ latest
• Frontend Weekend FW Podcast # 5 - Secrets to Successful Talks for Frontend Conferences
• Custom Properties - HTML Shorts
• Asynchronous web, or what are web sockets
• Browserslist is a good idea.
• Webpack vs gulp
• How can I make my icon system available?
• How to improve projects with outdated code
• Sandbox for GraphQL
• WebAssembly: Mozilla won
• Performance:
  
  • Faster page loading with light CSS and SVG animations (no JavaScript)
  • New to Web Performance Adventures
  • Test CSS animation performance using browser-based developer tools
  • Catching garbage: how we discovered the slowest parts of the UI
  • Using Performance Metrics That Most Affect UX
  • Frontend Performance Checklist for Production
  • HTTP / 2 push is more complicated than I thought
  
  

CSS

• 11 things I learned by reading the flexbox spec
• CSS in JavaScript: the future of component styles
• Learn CSS grids . Learning CSS Grids Translation
• CSS Media Queries Level 4 by Florian Rivoal
• Create a style guide directly from Sass code
• Is CSS Doomed To Always Slam?
• CSS love letter
• CSS filters for adjusting brightness, contrast, opacity and inversion
• Report in numbers: a year and a half with atomic CSS
• New responsiveness on the web - viewport units
• Details on the nuances of creating custom checkboxes and radio buttons
• The art of animating a single div per page
• <css-doodle /> - a web component for drawing patterns using css.
• Wide-block column break technique with CSS Grid
• scssfmt - fast and easy SCSS code formatter
• CSS trending shadows
• ctr - regular CSS Framework
• A selection of palettes for spectacular animation of gradients

Javascript

• Must see: videos of the metap MoscowJS 37
• Rethinking JavaScript: break and a functional approach
• Handbook of Modern JavaScript Concepts: Part 2
• Summary of the discussion about choosing a new JavaScript framework for WordPress
• What does Google AMP mean for the JavaScript community
• CSS state management with reusable JavaScript functions - part 2
• Reactive UI with VanillaJS - Part 1: Pure Functional Style
• An Introduction to the Most Used ES6 Features
• How to track changes in the DOM using the Mutation Observer
• Why javascript?
• Creating a simple Twitter bot with Node.js in just 38 lines of code
• React:
  
  • Podcast Five Minute React # 20 - MobX instead of Redux?
  • Improving React and Redux Performance with Reselect
  • Creating a React Component Library | Part 1 , Part 2
  • Airbnb switched to React to create a more responsive frontend
  • Why use React JS to create fast interactive UIs?
  • Get Better Reactivity with Advanced Web Applications
  • Optimization of rendering in React (part 1)
  • React as a platform: the path to cross-platform UI - Leland Richardson
  
  
• Angular:
  
  • Dynamic angular or manipulate correctly
  • Here is what you need to know about dynamic components in Angular
  • React vs Angular vs Vue in examples
  • What are the pros and cons of AngularJS and ReactJS?
  
  
• Vue:
  
  • Let's start the modern frontend development with Vue.js
  • Prototyping Filter UX on Instagram with Vue
  • Using Filters in Vue.js
  • vue-recyclerview - reloading large list items with vue-recyclerview
  
  
• Libs & Plugins:
  
  • Клевая скролл-анимация с помощью библиотеки AOS
  • t-scroll — плагин для создания анимации по скроллу
  • Timeline.js — плагин для создания хронологического слайдера с временной шкалой
  • AmplitudeJS — современный HTML аудио-плеер
  • o — браузерный загрузчик/бандлер для JS. Без зависимостей, node и cli
  • taxi-rank — JSDom на базе Selenium Webdriver API
  • picodom — 1Kb Virtual DOM
  
  

Браузеры

• Chrome победил
• Google представил план интеграции блокировщика рекламы в Chrome
• Браузер на основе блокчейна Brave провел ICO и привлёк $35 млн за 30 секунд
• FF Developer Edition 54: новые функции инспектора и отладчика, помощь MDN в netmonitor и многое другое
• Chrome 59 — что нового в DevTools
• Технические детали Safari Technology Preview 31

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

• Microsoft кардинально обновила дизайн Skype. И теперь там есть «Истории»
• Датский стартап научил нейросеть верстать интерфейсы сайтов и приложений по макету
• Google выпустила сервис для визуализации данных через GIF-изображения
• Google вносит в чёрный список сайты, передающие пароли по HTTP
• Баг в Chrome позволяет сайтам записывать аудио и видео незаметно для пользователя
• В Google появился персональный поиск
• AlphaGo разгромила лучшего игрока-человека в го со счетом 3-0 и покинула спорт
• Facebook, Google и ещё 29 ИТ-гигантов выступили против интернет-шпионажа
• Создатель Android Энди Рубин представил свой первый смартфон и конкурента Google Home
• Microsoft создает новую оболочку для мобильных устройств
• IoT-устройства компрометируют своих владельцев, даже если трафик зашифрован
• «Умный, но не заносчивый» — как выбирали имена системам искусственного интеллекта
• 2017 online trends: eSports skyrocketing, visual advertising and online medicine
• Why trained on GTA neural networks can not be used in real tasks
• How to build a business with $ 600 million valuation on GIFs - Giphy service history
• Scientists: in social networks, people perceive information at times less critical
• A site that calculates the likelihood that your work will go to the robot
• Computers will disappear physically. But will be around us - the farewell column of Walt Mossberg

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