The digest of fresh materials from the world of the front-end for the last week No. 297 (January 8 - 14, 2018)
We bring to your attention a selection with links to new materials from the frontend area and around it.
Media | Web Development | CSS | Javascript | Browsers | Entertaining
• Podcast "Web Standards", Issue No. 102: Why do we need experiments with CSS, Hayak in JS, how CSS specifications evolve and what prevents them, styles in the component stack.
• Podcast "Web Standards", Issue No. 103: Browsers and interface development, where to look if you lost an article, a semicolon in JS, it is clear about CSS alignment, Sarah's tricks with SVG, project management, front-end in Berlin.
• Frontend Weekend podcast # 34 - Oleg Bunin about organizing conferences, Pavel Durov and ticket prices
• Frontend Weekend podcast # 35 - The shocking truth about Youth Frontend
• devschacht podcast: Night frontend # 17 - Webstorm, Wallaby for poor and native modules
• Podcast “Frontend Youth (18+)” # 31: Should I rewrite your project in Rust?
• Podcast “Frontend Youth (18+)” # 33: Speculative code execution engine
• “ALL YOUR HTML” # 31: “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 with FrontFest 2017 : code and creativity, SPA development, graphics optimization, declarative template, algorithms and data structures, accessibility, i18n and more
• The neural network that typeset sites in the picture
• Frontend in 2018: more consensus, less complexity
• What's new in HTML 5.2?
• An overview of HTML 5.2 Dialog
• Optimization of SVG Text & Image Delivery using with Inline SVG . When one SVG embedding technique is not enough
• Do we need CSS preprocessors in 2018, or how close are we to vanilla CSS
• Make CSS animations more natural
• Improve typography with Font Variants
• CSS Cheat Sheet - a modern CSS cheat sheet
• Demystify CSS alignment
• “display: contents” getting closer . Finally, support for “display: contents” is included in Chromium and WebKit, and here are a few words about it
• Recent ways to deal with cascade, inheritance, and specificity
• 2017 Rising Stars in JavaScript . A complete overview of the landscape of 2017: trends of front-end and node frameworks, tools, IDE, mobile, testing, etc.
• ESLint: do not write JavaScript without it!
• A Complete Guide to Deploying a JavaScript Application - Part 1: Database and Deployment API
• Six Small but Cool ES7 + ES8 Properties
• “Creating a JavaScript Robot” - Anna Gerber's CampJS talk
• GTK + 2 will be discontinued in Firefox 59
• David Walsh joins Mozilla DevTools development team
• What Specter and Meltdown mean for WebKit
• Intel and Microsoft have recognized that patches for Meltdown and Specter slow down computers
• Exploits and performance tests related to vulnerabilities Meltdown and Specter
• Everything is at risk. What is Meltdown and Specter and how to live with them?
• A patch against Specter reduces iPhone 6 performance by up to 50%
• The most interesting AI solutions and projects of 2017
• CES 2018: The most interesting gadgets of the exhibition
• Microsoft teamed up with Open Whisper Systems and introduced end-to-end encryption in Skype
• How to evaluate the project and not to get into trouble? Part 1 , Part 2
Last week's digest .
Material prepared dersmoll and alekskorovin .
Media | Web Development | CSS | Javascript | Browsers | Entertaining
Media
• Podcast "Web Standards", Issue No. 102: Why do we need experiments with CSS, Hayak in JS, how CSS specifications evolve and what prevents them, styles in the component stack.
• Podcast "Web Standards", Issue No. 103: Browsers and interface development, where to look if you lost an article, a semicolon in JS, it is clear about CSS alignment, Sarah's tricks with SVG, project management, front-end in Berlin.
• Frontend Weekend podcast # 34 - Oleg Bunin about organizing conferences, Pavel Durov and ticket prices
• Frontend Weekend podcast # 35 - The shocking truth about Youth Frontend
• devschacht podcast: Night frontend # 17 - Webstorm, Wallaby for poor and native modules
• Podcast “Frontend Youth (18+)” # 31: Should I rewrite your project in Rust?
• Podcast “Frontend Youth (18+)” # 33: Speculative code execution engine
• “ALL YOUR HTML” # 31: “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 with FrontFest 2017 : code and creativity, SPA development, graphics optimization, declarative template, algorithms and data structures, accessibility, i18n and more
Web development
• The neural network that typeset sites in the picture
• Frontend in 2018: more consensus, less complexity
• What's new in HTML 5.2?
• An overview of HTML 5.2 Dialog
• Optimization of SVG Text & Image Delivery using with Inline SVG . When one SVG embedding technique is not enough
- Security:
• A story about how I steal credit card numbers and passwords from visitors to your sites
• A story about how I mine broadcast through meltdown on your phones using npm
• An anti-spam system crashed into the NPM repository
• Third-party scripts . Expert opinions on their impact on performance and security, as well as a selection of links to relevant materials
• Explanation of HTTPS on the example of pigeon mail
• Will Specter & Meltdown break JavaScript?
- Productivity:
• Google updated the PageSpeed Insights tool
• 8 front-end experts express their thoughts on web performance in 2018
• Optimization of pages using the “Save-Data” heading
• Black Friday / Cyber Monday 2017: Analysis and statistics of top Internet performance stores during sales
- AMP / PWA:
• Google has found a solution to the problem of displaying URLs in AMP results
• Google has significantly updated the tool for checking AMP pages
• Letter about Google AMP . Open letter from the community against Google’s exclusive enforcement of technology
• A progressive web application for every project
- Tools:
• Debugging JavaScript using WebStorm 2017.3 in conjunction with Chrome DevTools
• VS Code Blog: What's new for debugging under Chrome
• Webpack: JSON Tree Shaking will be used in Webpack 4.0 , By default Webpack 4 will work in configless mode
- Accessibility:
• Ramp for the site
• Small improvements that can have a huge impact on the accessibility of your site
• Blind woman sues 30 sites because of accessibility problems
• Understanding WCAG 2.1 - an overview of success criteria for cognitive impairment
• Small steps in accessibility side N26 - a major European online bank with a web platform on React
- Animation:
• Masked Circle Slider
• ertdfgcvb - interactive ascii animation
• Pure CSS Burrito Toggle - how far you can go with custom checkboxes
• Fantastic Pen demos and where to look for them: part # 1 , part # 2
CSS
• Do we need CSS preprocessors in 2018, or how close are we to vanilla CSS
• Make CSS animations more natural
• Improve typography with Font Variants
• CSS Cheat Sheet - a modern CSS cheat sheet
• Demystify CSS alignment
• “display: contents” getting closer . Finally, support for “display: contents” is included in Chromium and WebKit, and here are a few words about it
• Recent ways to deal with cascade, inheritance, and specificity
Javascript
• 2017 Rising Stars in JavaScript . A complete overview of the landscape of 2017: trends of front-end and node frameworks, tools, IDE, mobile, testing, etc.
• ESLint: do not write JavaScript without it!
• A Complete Guide to Deploying a JavaScript Application - Part 1: Database and Deployment API
• Six Small but Cool ES7 + ES8 Properties
• “Creating a JavaScript Robot” - Anna Gerber's CampJS talk
- Фреймворки:
• Stack Overflow назвал самые трендовые JS-фреймворки в соответствии с концепцией жизненного цикла
• Топ JavaScript библиотек и технологий, которые стоит изучить в 2018
• npmjs.com: Состояние JavaScript фреймворков, 2017 Часть 1: Front-End фреймворки, Часть 2: Экосистема React, Часть 3: Back-End фреймворки
• Почему React более популярен, чем Angular?
- Теория:
• Возможности JavaScript, о существовании которых я не знал
• Почему мутация может быть пугающей
• Понимание стэка вызова в JavaScript
• Как читать ECMAScript спецификацию
- React:
• 5 практических советов, чтобы наконец выучить React в 2018
• Введение в React Router v4 и его философию роутинга
• React, Redux и архитектура JavaScript
• Знакомство с Immer: новый способ простой работы с иммутабельностью
• Как создать чат в реальном времени на React и GraphQL
• react-perf-devtool — расширение Chrome devtools для инспектирования производительности компонентов React
- Angular:
• Реактивные формы (reactive forms) Angular 5 (2+) Часть 1
• Анализ и оптимизация бандла Angular 5 приложения
• Ngx-kit — набор инструментов и генератор компонентов для Angular 5
• Стал доступен Angular 5.2
• Динамическая загрузка компонентов с помощью Angular CLI
• 12 вещей, которые помогут большим организациям работать Angular правильно
- VueJS:
• Vuebnb: A Full-Stack Vue.js and Laravel App
• Интернационализация с помощью vue-i18n (часть 1)
• Пять ловушек, которые необходимо избегать при юнит тестировании Vue.js
Браузеры
• GTK + 2 will be discontinued in Firefox 59
• 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
• Exploits and performance tests related to vulnerabilities Meltdown and Specter
• Everything is at risk. What is Meltdown and Specter and how to live with them?
• A patch against Specter reduces iPhone 6 performance by up to 50%
• The most interesting AI solutions and projects of 2017
• CES 2018: The most interesting gadgets of the exhibition
• Microsoft teamed up with Open Whisper Systems and introduced end-to-end encryption in Skype
• How to evaluate the project and not to get into trouble? Part 1 , Part 2
We apologize for any typos or broken / duplicated links. If you notice a problem - please write in a personal email, we try to quickly fix them.
Last week's digest .
Material prepared dersmoll and alekskorovin .