The digest of fresh materials from the world of the frontend for the last week №297 (January 8 - 14, 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 # 102: Why we need experiments with CSS, Hyaku on JS, how CSS specifications evolve and what's stopping them, styles in the component stack.
• Web Standards podcast, Issue # 103: Browsers and interface development, where to look for, if you lost an article, a semicolon in JS, understandable about CSS alignment, Sarah's tricks with SVG, project management, Berlin fender.
• Podcast "Frontend Weekend" # 34 - Oleg Bunin about organizing conferences, Pavel Durov and ticket prices
• Podcast "Frontend Weekend" # 35 - The Shocking Truth About The Frontend Of Youth
• Devschacht Podcast: Night Front End # 17 - Webstorm for the Poor, Poorst and Native Modules
• Podcast "Frontend Youth (18+)" # 31: Should I rewrite your project on Rust?
• Podcast "Frontend Youth (18+)" # 33: The mechanism of speculative code execution
• “ALL YOUR HTML” # 31: “Layout of a simple layout and communication”
• 6 videos from KharkivFrontend Meetup # _0 : Boilerplate, GraphQL, D3, Service Workers, Kiss and How to make money on accessibility
• 23 reports from FrontFest 2017 : code and creativity, SPA development, graphics optimization, declarative templating, algorithms and data structures, accessibility, i18n, and more

Web development

• Neural network, which imposes sites on the picture
• Frontend 2018: more consensus, less complexity
• What's new in HTML 5.2?
• HTML 5.2 Dialog Overview
• Optimize SVG Text & Image Delivery with inline SVG . When SVG Embedding Technology is Not Enough
')

• Security:
  • The story of how I steal credit card numbers and passwords from visitors to your sites
  • A story about how I live via meltdown on your phones using npm
  • Failure of the anti-spam system led to a collapse in the NPM repository
  • Third party scripts . Expert opinions on their impact on performance and safety, as well as a selection of links to relevant materials
  • An explanation of HTTPS on the example of pigeon mail
  • Do Specter & Meltdown JavaScript Break?
  

• Performance:
  • Google updated PageSpeed ​​Insights tool
  • 8 frontend experts express their thoughts on web productivity in 2018
  • Optimize pages using the “Save-Data” header
  • Black Friday / Cyber ​​Monday 2017: Analysis and performance statistics of top online stores during sales
  

• AMP / PWA:
  • Google has found a solution to the problem with displaying the URL in the AMP results
  • Google has significantly updated the tool to check the AMP-pages
  • A letter about google amp . An open letter to the community against the exclusive imposition by Google of its technologies
  • Progressive web application for each project
  

• Tools:
  • Debugging JavaScript using WebStorm 2017.3 in conjunction with Chrome DevTools
  • VS Code Blog: What's new for debugging under Chrome
  • Webpack: Webpack 4.0 will use JSON Tree Shaking , By default, Webpack 4 will work in configless mode
  

• Accessibility:
  • Ramp for the site
  • Small improvements that can have a huge impact on the availability of your site
  • Blind woman sues 30 sites due to accessibility issues.
  • Understanding WCAG 2.1 - A Review of Success Criteria for Cognitive Disorders
  • Small steps towards accessibility N26 - a large European online bank with a web platform on React
  

• Animation:
  • Masked Circle Slider
  • ertdfgcvb - interactive ascii animation
  • Pure CSS Burrito Toggle - how far can you go with custom checkboxes
  • Fantastic Pen demos and where to find them: part # 1 , part # 2
  
  

CSS

• Do we need CSS preprocessors in 2018, or how close are we to vanilla CSS
• Making CSS animations more natural.
• Improving typography with Font Variants
• CSS Cheat Sheet - Modern CSS Cheat Sheet
• CSS Alignment Alignment
• “Display: contents” is getting closer . Finally, “display: contents” support is included in Chromium and WebKit, and here are a few words about it.
• Latest ways to deal with cascade, inheritance and specificity

Javascript

• Rising Stars 2017th in JavaScript . A complete overview of the landscape of 2017: trends of the frontend and node frameworks, toolkit, IDE, mobile, testing, etc.
• ESLint: do not write JavaScript without it!
• Complete JavaScript application deployment guide - part 1: Database and API Deployment
• Six small but cool features ES7 + ES8
• "Creating a robot on JavaScript" - Anna Gerber talk with CampJS

• Framework:
  • Stack Overflow called the most trendy JS frameworks in accordance with the concept of the life cycle
  • Top JavaScript libraries and technologies worth exploring in 2018
  • npmjs.com: Status of JavaScript Framework, 2017 Part 1: Front-End Framework , Part 2: React Ecosystem , Part 3: Back-End Framework
  • Why is React more popular than Angular?
  

• Theory:
  • JavaScript features that I didn't know existed
  • Why a mutation can be frightening
  • Understanding JavaScript Call Stack
  • How to read ECMAScript specification
  

• React:
  • 5 practical tips to finally learn React in 2018
  • Introduction to React Router v4 and its routing philosophy
  • React, Redux and JavaScript Architecture
  • Introducing Immer: A New Way To Easily Work With Immunity
  • How to create real-time chat in React and GraphQL
  • react-perf-devtool - Chrome devtools extension to inspect the performance of React components
  

• Angular:
  • Reactive forms (reactive forms) Angular 5 (2+) Part 1
  • Analysis and optimization of the Angular 5 application bundle
  • Ngx-kit - tool kit and component generator for Angular 5
  • Became available Angular 5.2
  • Dynamic component loading with Angular CLI
  • 12 things that will help large organizations to work Angular correctly
  

• VueJS:
  • Vuebnb: A Full-Stack Vue.js and Laravel App
  • Internationalization with vue-i18n (part 1)
  • Five pitfalls to avoid when unit testing Vue.js
  

Browsers

• Firefox 59 will discontinue GTK + 2 support.
• David Walsh Joins Mozilla DevTools Development Team
• What Specter and Meltdown mean for WebKit

Entertaining

• Intel and Microsoft have recognized that patches for Meltdown and Specter slow down computers.
• Meltdown and Specter exploits and performance tests
• Everything is under threat. What is Meltdown and Specter and how to live with them?
• The Specter Patch reduces the performance of the iPhone 6 to 50%
• The most interesting AI-solutions and projects in 2017
• CES 2018: The most interesting exhibition gadgets
• Microsoft has teamed up with Open Whisper Systems and introduced Skype's end-to-end encryption.
• How to evaluate the project and not be in a mess? part 1 , part 2

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 .