The digest of fresh materials from the world of the frontend for the last week No. 317 (May 28 - June 3, 2018)

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

Media | Web Development | CSS | Javascript | Browsers | Entertaining

---

Media

• Podcast “Web Standards”, Release No.123: YaC and WWDC, new Chrome, Edge and Firefox, nesting, calc and CSS hackers, how to write code quickly, variable fonts, await and ES modules, is there a beast full stack, Yandex Landings
• Podcast "Frontend Weekend" # 55 - Nikita Prokopov about ClojureScript, blogging and creating your own font
• Devschacht podcast: Night Frontend # 35 - RIT ++
• Podcast "Frontend Youth (18+)" # 50 Myths about zero configuration
• CSSSR Podcast: News 512 - Issue # 8 (May 28 - Jun 3)
• ALL YOUR HTML # 51: “Connected Particles in 3D”

Web development

• New releases: GSAP 2.0 , WordPress 15 , Lighthouse 3.0 preview , Material-UI v1 release , Jest 23 , TypeScript 2.9 preview
• Why is the development of the frontend so unstable?
• The cult of complexity . Jeffrey Zeldman's critical note on the current state of web development
• Create responsive image . How to create a logo that matches the ratio of its sides
• 9 amazing secrets of PWA
• Available focus indicators: what you need to focus on

• Performance:
  • prerender-loader! - universal pre-rendering for webpack. Improves first paint, often without even changing the code.
  • What is Client Hints and is it worth using them?
  • Reducing the size of images using color sampling
  

• Tools:
  • On Yarn and back (on npm) again
  • Chrome 67 - what's new in DevTools
  • Three steps to deploy Webpack applications on Heroku
  

CSS

• Algebra in calc (), new specificity of level 4 selectors and other May CSS news
• Where everything is difficult with line breaks. Here are all the CSS and HTML tricks for this.
• Explaining Z-index: how to position elements using CSS
• Resolving Life Problems with CSS
• critters - Webpack plugin for inlining critical CSS and lazy loading for the rest.
• How CSS Works: Understanding the Cascade
• Gradient Change Status with CSS Transitions and Animations
• HSL () / HSLa () are great for software color control.

Javascript

• Useful methods of arrays and objects in javascript
• #SmooshGate FAQ
• Properties of modern javascript that you should use every day to improve development and what problems they solve
• Best Practices for Using Modern JavaScript Syntax
• Capturing and reporting javascript errors using window.onerror

• ES2015 +:
  • What's new in ES2017: Async features, enhanced features and more
  • ES6 (ES2015) and after it: Understanding JavaScript Versioning
  • ES6 in action: improved object literals
  • Flow control in modern JS: Callbacks to Promises to Async / Await
  

• VueJS:
  • Creating modern applications with Django and Vue.js
  • Create live graphs using Vue.js
  • Best resources to learn Vue.js in 2018
  • From VanillaJS to Vue.js: the history of refactoring
  

• React:
  • Let's fall in love with React Fiber
  • Reach Router is a new router with an emphasis on accessibility. Quick overview of properties and features of use
  • Next.js Guide: SEO-Friendly React E-Commerce SPA
  • react-ideal-image - almost perfect React component for images
  • The most important lessons that I learned after a year of working with React
  • Understanding Redux: The World's Most Simple Guide for Beginners
  • Managing Application State in React with Unstated
  

• Angular:
  • NgRx - Best Practices for Enterprise Applications at Angular
  • Angular + Redux - a lesson that we have learned for you
  • 44 quick tips for tweaking angular performance
  

• Libs & Plugins:
  • proppyjs - A small js library for props functional composition. Supports ReactJS, VueJS, PreactJS and ReactiveX
  • 11 Javascript libraries you need to know in 2018
  • minipack is a simplified example of modern modular builders written in JS
  

Browsers

• Chrome 67 web browser release
• In Firefox 63, the mining script blocker cryptocurrency will be introduced
• Vulnerability in Chrome and Firefox throughout the year made it possible to get data on Facebook profiles
• Google Chrome has added support for passwordless authentication on WebAuthn standard sites.

Entertaining

• Return of Geektimes to Habr
• Architect Big Data Tesla: our autopilot is SkyNet from Terminator
• Which fonts are best used for complex data
• How to teach a child to program
• Is QWERTY a bad layout and why can’t we refuse it?
• Microsoft is negotiating the purchase of GitHub
Go

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 from last week .
Material prepared dersmoll and alekskorovin .