The digest of fresh materials from the world of the frontend for the last week №259 (April 17 - 24, 2017)

We offer to your attention a selection with links to useful resources and interesting materials from the frontend area.

Web development

CSS

Javascript

Browsers

Entertaining

Web development

• Web Standards Podcast, Issue # 65 : Firefox, Safari, Chrome, Asynchrony and ES, PhantomJS Everything, Web Components Dispute and Magic Addiction.
• Reflections on Unfulfilled Web Component Promises
• 10 most destructive mistakes in mobile SEO
• Ambient light sensors can be used to steal data from a browser
• Facebook has opened frameworks for building an interface: Litho, React Fiber, Relay Modern and React VR
• Performance:
  
  
  • Detailed performance analysis techniques using Dev Tools on the Google Developer Blog
  • Presentation of the pwmetrics library for analyzing various factors that affect page loading speed
  • Five Lazy Load technician for images to improve site performance
  • Performance Testing - Tools and Waterfall Charts
  
  
• Slides and videos from the Render 2017 conference : Workflow in a modern frontend from Umar Hansa, How to choose the right technologies from Jeremy Keith, Getting started using CSS Grid Layouts today from Rachel Andrew and other reports
• F8 presentations, developer conferences from Facebook
• Mega Tags - the most complete social meta tag generator.
• What's new on AMP by Example ”site : new design, interactive sandbox, update of components and new examples
• RealWorld - see how absolutely the same blogging platform works on completely different stacks: React / Angular and Node / Rails / Django
• Morphing SVG Slider - 20th Century Women
• Creative concept page for developer / designer

CSS

• Remy, emy, and why rejection of them - not a problem
• It's time to start using custom CSS properties.
• Go to the system font stack in 2017
• 8 examples of how not to need and how to write CSS selectors
• CSS Grid Layout - New Terminology
• CSS Grid Cheat Sheet: A Complete Visual Grid Guide
• Between the lines - in detail about the technique of implementing adaptive typography and layouts.
• Atomic CSS Problem
• Creating sustainable architecture on Sass: part 2
• ragrid - the base grid on flexbox
• How we made our product more personalized with CSS variables and React
• Journey to highly efficient and supported CSS media queries
• On the status of variable fonts in browsers at the beginning of 2017
• Use flow root today

Javascripts

• A revolution in javascript. Literally
• Ways to debug JS on client
• Difficult lessons: five years with Node.js
• Static Land Specification
• Review JS testing in 2017
• Parsing JavaScript Testing Tools: Sinon.js vs testdouble.js
• JavaScript: what excites me in 2017
• Javascript: learning regular expressions for newbies
• Control mouse and touch input using the Pointer Events API
• CSS in js. Rockey.
• Practice:
  ')
  
  • Array traversal methods
  • Add a comment to the code: good, bad, ugly
  • Adaptive javascript background images
  • Getting started with Three.js
  • Getting Started with Chart.js: Introduction
  
  
• ES2016 +:
  
  
  • Native ECMAScript Modules - First Review
  • Asynchronous functions 101
  • Async iterators and generators
  • It's time to master the arrow functions
  
  
• React:
  
  
  • Five Minute React # 12 podcast - React 15.5 and other news
  • Facebook is preparing for the release of React Fiber, restarting the JS React · library
  • Oculus has published the React VR WebVR library
  • Create your own Redux, part 2: connect function
  • React Move - beautiful and isolated animations of everything in the reactor
  • Quick tip: how to style React components with styled-components
  • Choosing between React and Angular: a deep comparison
  • Using AngularJS components and directives in React
  • When is a project needed React?
  • Things no one will tell you about React.js
  
  
• Vue:
  
  
  • Vuejs 2 Authentication Guide
  • Unit testing for Vue.js and TypeScript
  • The power of user directives in Vue
  • Let's create a web application with Vue, Chart.js and API
  • Making a Tic-Tac-Toe Game on Vue 2: Part 2
  • vee-validate - a simple plugin for validating input fields for Vue.js
  
  
• Angular:
  
  
  • All you need to know about detecting changes in Angular
  • Questions for an Angular Developer Interview
  • Angular 2.0 vs Polymer
  
  
• Libs & Plugins:
  
  
  • zuck.js - javascript library that allows you to add stories EVERYWHERE
  • Forall.js - Expressive static types and invariant JavaScript checks. It looks like TypeScript, but with nuances
  • d3-annotation - add annotations to visualizations
  • lodash-form-collector - lodash form data collector
  • simple-slider - simple micro-carousel, 1.2kb
  • HR.js - plugin for selecting and replacing text in the DOM

Browsers

• Google is credited with intending to embed the “inappropriate” ad blocker feature in Chrome browser
• Launch Chrome 58 Web Browser
• Firefox 53 release , plus details for developers
• Testing the beta version of Firefox 54
• Restructuring the Firefox development process and abandoning the Aurora branch
• Improved JavaScript, WebAssembly, and Shared Memory performance in Microsoft Edge
• Details on how to rewrite the DOM in Microsoft Edge

Entertaining

• Social network in virtual reality, computer control by the power of thought and many new products for developers - all that Facebook showed at the F8 conference . 8 important announcements from the Facebook F8 conference and their importance for marketers
• Google has opened an access to the Cloud Speech API, which is the basis of Google Assistant speech recognition technology.
• “Even the creators of AI do not fully know how it works”: 4 problems of artificial intelligence
• Mastercard Introduces New Generation Biometric Bank Card
• Video: Grigory Bakunov showed his own voice assistant for the car
• "We are not Facebook or Instagram": Pinterest service removed the Like button
• Ilon Mask plans to create full-fledged neural interfaces for connecting the brain with a computer for 8-10 years, and products for medicine - for four
• How Reddit created r / Place
• The whole Harvard course in the basics of programming . 23 lectures in Russian 40-60 minutes each
• New version of Google Earth: Earth in full view
• Google Hire - a new job search service
• Internet Archive launched online Macintosh emulator

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