The digest of fresh materials from the world of the frontend for the last week №324 (July 23 - 29, 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”, Issue # 131: Chrome 68, dangerous HTTP, React or jQuery, you don’t know inline-blocks, illustrated flexes, courses in English, Babel’s dangerous presets, browsers interfere with JS
• Podcast "Frontend Weekend" # 63 - Alexander Pershin on how and why to create a school of online education in Russia
• Podcast "CSSSR" News 512 - Issue number 16 (July 23 - July 29 )
• Devshakhta / Night Frontend Podcast: # 43 - Again about Jenkins, ChaosConstructions 2018, ndb and SRI
• Podcast "Frontend Youth (18+)": # 58 Why jQuery was fired from GitHub

Web development

• The Basics of Progressive Web Applications
• 3 important checklists for web developers
• Available Page Headers in Single Page App
• The smart way to “minimal fullstek” . From simple SPA to multifunctional PWA
')

• Images:
  • Convert images to WebP . Excerpt from “The WebP Manual”
  • Sometimes `sizes` in images are pretty important.
  • Why WebM is better than GIF for video (comparison)
  • 8 Video Optimization Tips to Speed ​​Up Your Download
  

• Performance:
  • Front-end performance checklist . Russian translation of the popular checklist
  • Frontend News # 1: Tips for balancing web fonts and page loading speed
  • Site size: the average page size is more than 2MB - the average page size has doubled in the last 3 years
  • How to get rid of blocking rendering JavaScript and CSS
  • Speed ​​is now a factor for Google Search and Ads landing pages.
  • Report: Google mobile speed update did not affect shared mobile metrics
  

• Instruments:
  • Set up a convenient npm project for yourself and the team or a little about modern front-end tools
  • Debugging with Chrome DevTools: Quick Tips for the Frontend
  • Terminalizer - record your terminal's work in an animated gif
  • Github story - Browser Extension - template for describing pull requests on Github
  

CSS

• How to quickly prototype apps with a CSS grid and CSS variables
• CSS-in-JS - myths and reality (for example, styled-components)
• Amazing and unknown inline-block
• Why CSS Grid is better than Bootstrap for creating layouts
• Frustrations with CSS Shapes and CSS Exclusions
• Resolved with CSS! Logical stylization based on the number of elements received
• Specific magic flexbox and auto margins
• Creating a design system, part 2: Grid & Layout
• 5 new CSS properties and how to use them

Javascript

• Github.com refuses to use jQuery and switches to pure JavaScript
• Creating a state management system in pure javascript
• Why is the new V8 so damn fast
• CSS in JS in real life

• Framework:
  • Yes, you should learn Vanilla JavaScript in front of the trendy JS framework
  • How to improve your JavaScript knowledge by writing your own framework
  • React vs. Vue (vs. Angular)
  

• Theory:
  • About generators in javascript es6 and why it’s not necessary to study them
  • Adventure operator pipeline in babel @ 7
  • Use of promises in javascript
  • Javascript tutorial for beginners
  • Let's talk about semicolons in javascript
  • Stateful Monads in JavaScript: Part 1 , Part 2
  • Callbacks - improve your knowledge of callback-based APIs, learn their behavior and patterns in JavaScript
  • How to stop using callbacks and start living
  

• React:
  • Basics of React (textbook, 2nd edition)
  • Examining Render Props by Example
  • Tricks and tips for Reactjs SSR
  • React State Machines
  

• Angular:
  • Became available Angular v6.1 - TypeScript 2.9, Scroll Positioning and more
  • The mechanism of one-sided binding values ​​in Angular
  • Understanding a large scalable angular application with @ngrx
  • Turn Angular 6 into Progressive Web App
  

• Libs & Plugins:
  • ndb - improved Node.js debugging enabled via Chrome DevTools
  • excel4node - a module to Node, which simplifies the creation of Excel files
  • jsQR - library for reading QR codes in images without dependencies
  • simple-data-table - easy and simple library for working with tables without dependencies
  • AddThis is now available for AMP
  

Browsers

• What's new in DevTools in Chrome version 68
• Why opening YouTube in Firefox or Edge can take 5 times longer than Google Chrome
• Chrome 68 web browser release
• An improved content blocking system will appear in Firefox 63
• Mozilla plans to remove RSS and Live Bookmarks support from Firefox
• Google Chrome stimulates the transition to HTTPS
• The real Metamask wallet extension was accidentally deleted from the Chrome Web Store instead of the fake
• A critical IE bug fixed in May required new patches and provoked a memory leak.

Entertaining

• Apple aftertaste: are executives, developers and designers ready to abandon their Macbook in favor of other laptops
• Check the site for "lice"
• When programmers get weird: fun projects with github
• Google developers unveiled Titan Security Key USB keys for secure authentication.
• Google grammar check grammar using machine learning technology
• In Windows 10, machine learning will be introduced to prevent an unpredictable system reboot due to updates.

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 .