The digest of fresh materials from the world of the frontend for the last week №251 (February 20 - 26, 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, Release # 56 : New Chrome, bad Base64, WebKit debugger, browser ES modules, Node.js and Webpack, cool UI, book with fishes, CSS variables.
• 2017 is the year that front-end developers must dedicate to the basics
• Recordings of the video conference The Rolling Scopes 2017 , held February 18 - 19 in Minsk
• Do we need a new header element? We do not know
  
• Testing HTTP / 2 speeds in the real world (WordPress, lots of images and plugins, tests with / without H2 with / without CDN)
• The trick with the addition of backing in the debugger for debug interactive elements that are difficult to catch
• Detailed introduction to Webpack
• Performance audit and nytimes.com Identify bottlenecks and all that
• Get started with VoiceOver & Accessibility
• Toolbars, keyboards and viewports
• HTML5 form attributes (part 1)
• Checklist Code Review
• The HTML5 Robot . Funny robot will tell you the right tag
• Achieve 60 FPS animations using FLIP principles (First, Last, Invert, Play)
• flatris - Tetris, written in web technologies - architecture on React / Redux, React Cosmos and PWA with offline support
• Draw and animate jelly shapes with Canvas
• Winner of the WebAssembly logo creation competition

CSS

• More about how Flexbox works - we explain it on large, colorful GIFs
• Trick: Separate CSS Transformation Functions
• Two new first CSS public drafts
• Unexpected Power of CSS Viewer Units
• Responsive Design Outside Media Query
• Adaptive CSS patterns without media expressions
• Why I love Element Queries and you should
• Scaling SVG Clipping Paths for use in CSS
• Variable fonts
• Getting started with variable fonts
• CSS Grid: Learning New Markup
• Cheat Sheet Alignment Blocks
• Nuances of CSS Transitionend Events
• Understanding and applying recursion in CSS
• How to use CSS animation professionally
• Propeller is another front-end framework based on Google’s Material Design Standards & Bootstrap.
• spacegrid - simple, responsive mesh

Javascript

• Emoji.prototype.length - a story about emotional characters in Unicode
• Modern JavaScript applications with Neutrino
• Why learn functional programming in javascript?
• Functional javascript for lazy developers (like me)
• Ten-minute guide to JS modules, formats, loaders and assemblers.
• We play massive muscles . Back to the basics of JS
• Animated introduction to RxJS
• Quick tip: sorting user lists with Flexbox and jQuery
• babel-preset-env: a preset for configuring babel for you
• Creating cool forms with Ember.js
• What stack should i use for my spa?
• Front-end: Angular vs. React vs. Vue
• ES2015 +:
  
  
  • ECMAScript 2016+ in Firefox
  • Understand the promises before using async / await
  • Even with async / await, pure promises are still optimal with competitive queries.
  • What you need to know about the Number type in ES6 JavaScript
  • What you need to know about ES6 Maps
  
  
• Angular:
  ')
  
  • Basics of AngularJS 1.x (Part 2)
  • From angular.module to ngModule
  
  
• React:
  
  
  • How does React decide to redraw a component?
  • 10 mini patterns in React
  • How to scale Redux applications with Redux-Action-Recompose
  • boundless.js - components with UI for React-applications
  • Redux-query view
  
  
• Vue:
  
  
  • Manage application state with Vuex
  • A different point of Vue
  • Top 3 online courses on Vue.js 2
  • How routing works in VueJS
  • Vue-geb - Global Event Bus
  
  
• Libs & Plugins:
  
  
  • Javascript Image Processing
  • ReactiveMaps - a set of UI components for real-time maps
  • React Select - flexible customizable multi-select with auto-completion and AJAX support
  • unfetch - minimum polyfil for fetch
  • AR.js - Augmented Reality for the Web using ARToolKit - 60fps on mobile
  • Dwitter - canvas vizualization with a minimum of code
  • walletjs is a small library for working with monetary values.

Browsers

• Firefox begins testing new features of SnoozeTabs and Pulse
• Chrome 57 will not be able to disable DRM - copyright protection mechanism
• How to use mobile emulation mode in Chrome
• Browser Blisk - “the dream of every web developer”

Entertaining

• AMP pages appeared in the main issue of Google.ru
• Engineers from Google introduced the global file system Upspin
• Due to a vulnerability, Cloudflare has been merging customer data for months.
• The neural network "animates" the drawings of cats. It looks creepy
• The most understandable explanation of the principle of the blockchain
• Google gave access to its service, which measures the level of trolling in the comments.
• Life meme: who and how to earn funny pictures from the Internet
• An open letter to IT recruiters
• What is algorithmic art: from Mozart and Reich to "Neural Defense"
• "Fight for globalization." Mark Zuckerberg told about a new vector of development of his social network
• Google and Mozilla reported that antiviruses reduce the level of HTTPS protocol protection
• How algorithms affect life
• Bill Gates: Robots have to pay taxes, since they take work from people

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