The digest of fresh materials from the world of the frontend for the last week № 301 (February 5 - 11, 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 "Frontend Weekend" # 39 - Gregory Shechet about life and work in San Francisco, frontend-digest and FRP

• Web Standards podcast, Release No.107: CSS on JS in Chrome, HTTPS and SEO, service workers in Safari, CSS marketing, how to conduct and pass an interview.

• Devschacht podcast: Night Front End # 21 - Rolling Scopes, Day One

• Podcast "Five Minutes Angular" # 9 - Angular Msk, Pipeable Operators, Clarity UI, CLI 1.7.0 Beta 3, Ng 6.0 Beta 2

• The podcast "Drinkcast", # 25 - "Those are the most Java-fronder"

• "ALL YOUR HTML" # 35: "Wordpress Minisite from Zero in an Hour"

• Record of the WSD conference held in Moscow on February 3

• Mitap on BEM. From the basics to React.js.

• All videos from @SmashingConf London

• Yo a new show with the latest design and web development news from Rob Hope

')

Web development

• Frontend frameworks: custom vs ready-to-use solutions

• Another reason to use noopener is a deep immersion in the distribution of the rendering process.

• Web Assembly Studio - an online sandbox for learning Web Assembly

• Performance:
  
  
  
  • Optimize web performance with a webpack: reduce the size of the front-end code and monitor its speed . New guide from Ivan Akulov and Eddie Osmani on developers.google.com
  
  • How SEOs Can Benefit from Google Lighthouse - Web Performance Metrics
  
  • A look at the current state of progressive images and user perception
  
  • Site performance and crawling budget
  
  • How we made loading our pages even faster
  
  • Optimize your MP4 video for better performance
  
  

• AMP / PWA:
  
  
  
  • PWA on the desktop
  
  • Service workers: little heroes behind Progressive Web Apps
  
  • Google AMP & WordPress: All You Need to Know
  
  • We meet PWA in Microsoft Edge and Windows 10 . Microsoft outlined a strategy for implementing Progressive Web Apps
  
  

• Instruments:
  
  
  
  • Routing, banding and lazy loading on a Webpack
  
  • hreftools - a collection of online web tools to speed up your work
  
  • In the site analysis section, Chrome has a new category with SEO audit.
  
  • From Webpack to Parcel: create-react-app migration
  
  

• Accessibility:
  
  
  
  • aria label is xenophobia
  
  • My journey through accessibility: what I learned during this time
  
  • Accessibility Questions for the Job Interview
  
  • Simplified WCAG 2.1 Recommendations
  
  

• Effects:
  
  
  
  • Weekly selection of beautiful effects on CSS / SVG / JS # 69
  
  • Animated cube on pure CSS
  
  • CSS endless staircase
  
  • Slice Revealer . Spectacular slider strip animation
  
  • Guidance effects depending on the direction of cursor movement
  
  • Winamp2-js implementation on JS
  
  

CSS

• Modern CSS for dinosaurs

• Links against buttons in modern web applications

• Search for "dead" CSS

• CSS allows you to collect sensitive user data

• Using Media Queries for responsive design in 2018

• Using bevel gradients and CSS variables to create a pie chart for Range Input

• The theme of sites using CSS variables

• Calculations using CSS counters and CSS Grid

• modern-normalize - modern style normalization techniques in browsers

• 3 superpowers of Flex-Box model - how flex-basis, flex-shrink and flex-grow work

• Internet Explorer still exists. Should I use CSS Grid?

Javascript

• Top 10 errors from 1000+ JavaScript projects and recommendations for eliminating them

• How JS works: web workers and five use cases

• Learn to define red flags in your javascript / react code

• Overview of JavaScript Testing in 2018

• Five common problems in GraphQL applications (and how to fix them)

• JavaScript frameworks in numbers - winter 2018

• Angular 5 vs. React vs. Vue

• ES6:
  
  
  
  • Canceled Promises in EcmaScript6
  
  • JavaScript ES6 - spread (syntax) syntax
  
  • Javascript es6: extension operator
  
  • Using default settings in ES6
  
  • Javascript private variables
  
  

• React:
  
  
  
  • What's new in React 16.3 (.0-alpha)
  
  • Endless scroll techniques in React
  
  • Pattern Evolution in React
  
  • React Scope Presentation is a tool for visualizing your React components, showing how you interact with your application.
  
  • New Context API in React
  
  

• VueJS:
  
  
  
  • Creating a simple face recognition application using Vue.js and Kairos
  
  • Vue in 2018 - an interview with Evan You, the author of Vue.js
  
  

• Angular:
  
  
  
  • Transition from AngularJS to Angular: Goals, plans and rules for transferring elements (1/3) , Problems and solutions for hybrid mode (2/3) , Life after AngularJS (3/3)
  
  • Run the Angular Turnip CLI directly in your browser
  
  • Getting Started with Angular SDK
  
  

Browsers

• Faster than Firefox and in updated design: Opera 51 browser is introduced

• Announced the function of removing personal information from a URL in Firefox 59

• Google has released a beta version of Chrome 65 . Developers improved pop-up blocking, updated Android video player and introduced several new APIs.

• From July, Google Chrome will mark all HTTP sites as unsafe

• How does Google Chrome ad blocker work?

Entertaining

• 15 SEO myths that never die

• A new version of WordPress broke the engine auto-update feature.

• Google taught AI multitasking during an intensive gaming session.

• A vulnerability has been discovered that allows us to “put” almost all sites on the WordPress engine.

• Mozilla introduced the gateway to the Internet of Things

• What happens in the space business: an overview of promising areas of private space exploration

• Schrödinger's Blockchain: as a technology at the heart of Bitcoin is both useful and dangerous at the same time

• Identified the main trends of 2018 on GitHub projects

• “Personally, I welcome our mechanical masters”: the opinions of leading world scientists about AI

• Greed, fragility, opacity and pettiness: what is wrong with AI based on deep learning?

• The programmer solved the puzzle in 2015 and received 50 thousand dollars in bitcoins

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 by dersmoll and alekskorovin