Предлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него.
Медиа | Веб-разработка | CSS | Javascript | Браузеры | Занимательное
•
Подкаст «Веб-стандарты», Выпуск №163: Математика в CSS, быстродействие и оверхэд, новый видеокодек AV1, JavaScript и SEO, роботы нас не заменят.
•
«Девшахта-подкаст»: #71: Как TypeScript меняет наше мышление (часть 2)
• Подкаст «CSSSR» Новости 512 — Выпуск №40 (25.02 — 03.03)
•
На митап! #1: запись докладов. Материалы по итогам первой встречи в онлайн-формате, организованной HTML Academy
• Видеоблог Вадима Макеева: «15. Лайв с ответами»
• Турнир: «Лучшая JS-фича 2018» (ЧАСТЬ 4 — ФИНАЛ!)
•
Качество кода. Расшифровка доклада Ивана Ботанова с Frontend Conf, где он говорит о читаемости, нейминге, декларативности, Code style и отношениях между джунами и лидами
• Тестировать верстку? Легко
•
Переработка портфолио, часть 1: анимация, микровзаимодействия и SVG
• Генераторы статических сайтов: руководство для начинающих
• Как работает @supports
• Адаптивный дизайн и пользовательские свойства CSS: определение переменных и брейкпоинтов
• Ментальная модель CSS. Новая статья PPK, в которой он пытается объяснить философию CSS разработчикам Javascript
• Рабочая группа CSS согласилась добавить множество математических функций, среди которых acos(), asin(), atan(), hypot(), sqrt() и многие другие
• Breaking Boxes With CSS Fragmentation. Свежая статья Rachel Andrew о новой спецификации CSS
• Воссоздание градиентного эффекта Facebook Messenger с помощью CSS
• Детальный обзор принципов работы CSS селекторов + шпаргалка
• Менее известные CSS свойства в GIF
• 8 маленьких видео о редакторе Shape Path Editor в Firefox
• Победят ли пользовательские свойства CSS циклы Sass?
• Смотри-ка, никаких медиа-запросов! Адаптивные макеты с использованием CSS Grid
• Wolfensteiny 3D — реверс-инжиниринг 251 байтов JavaScript
• Google запускает серию видео на тему SEO для JavaScript
• FunES#9: загадка. Фокусы с JavaScript
• Релизы: Apollo Client 2.5, Ember 3.8, GSAP 2.1
• Как писать простые современные JavaScript-приложения с использованием Webpack и прогрессивных веб-технологий
• Понимание проблемы производительности с “полиморфическими” JSON данными
• 0Day-уязвимость в Chrome используется для кражи данных
• В Firefox 67 появится страница about:compat и выгрузка вкладок при нехватке памяти
• Google ускоряет Chrome с новой функцией кэширования открытых страниц
• В Firefox появится режим картинка в картинке и переработанный менеджер дополнений
• Хром больше не нужен
• Google открыла регистрацию доменов в зоне .dev для всех желающих
• Нейросеть научили подделывать голоса
• «Нашумевшая китайская система социального рейтинга на практике далека от новых технологий»
• Самые значимые события в отрасли искусственного интеллекта в 2018 году
• Узнаете ли вы язык программирования по коду для «Hello, World!» — тест по экзотическим языкам
• Компания Mozilla опубликовала голосовые данные Common Voice
• Линус Торвальдс не верит, что серверы на ARM-архитектуре заменят x86. «Продавать 64-битную модель — идиотизм»
• Новые языки программирования незаметно убивают нашу связь с реальностью
Дайджест за прошлую неделю.
Материал подготовили dersmoll и alekskorovin.
Медиа | Веб-разработка | CSS | Javascript | Браузеры | Занимательное
Медиа
•
Подкаст «Веб-стандарты», Выпуск №163: Математика в CSS, быстродействие и оверхэд, новый видеокодек AV1, JavaScript и SEO, роботы нас не заменят.•
«Девшахта-подкаст»: #71: Как TypeScript меняет наше мышление (часть 2)•
Подкаст «CSSSR» Новости 512 — Выпуск №40 (25.02 — 03.03) •
На митап! #1: запись докладов. Материалы по итогам первой встречи в онлайн-формате, организованной HTML Academy•
Видеоблог Вадима Макеева: «15. Лайв с ответами»•
Турнир: «Лучшая JS-фича 2018» (ЧАСТЬ 4 — ФИНАЛ!)
Веб-разработка
•
Качество кода. Расшифровка доклада Ивана Ботанова с Frontend Conf, где он говорит о читаемости, нейминге, декларативности, Code style и отношениях между джунами и лидами•
Тестировать верстку? Легко•
Переработка портфолио, часть 1: анимация, микровзаимодействия и SVG•
Генераторы статических сайтов: руководство для начинающих- Производительность:
• Google: скорость загрузки на мобильных должна быть постоянным приоритетом
• Для иллюзии быстрой загрузки страниц: правила создания скелетного экрана на сайтах и в приложениях
• A Bit of Performance. Новая статья Романа Комарова о деталях оптимизации его сайта — предзагрузка ссылок, шрифтов, прогрессивная навигация и тому подобное
• Serve Responsive Images
- Accessibility:
• Когда кнопка — не кнопка?
• Доступность не является «проблемой React»
• Web Accessibility Guide — Курируемая подборка советов, трюков и рекомендаций по веб-доступности.
• Практики обеспечения доступности для компонентов с выбором даты
• Анализ доступности домашних страниц 1.000.000 сайтов
• Использование искусственного интеллекта для создания альтернативного текста на изображениях
- Анимация:
• Эффекты фильтрации SVG. Часть 7. Продвижение вперед
• SVG Filter Effects: двигаемся дальше
• Text Trail Effect
CSS
• Как работает @supports
•
Адаптивный дизайн и пользовательские свойства CSS: определение переменных и брейкпоинтов•
Ментальная модель CSS. Новая статья PPK, в которой он пытается объяснить философию CSS разработчикам Javascript•
Рабочая группа CSS согласилась добавить множество математических функций, среди которых acos(), asin(), atan(), hypot(), sqrt() и многие другие•
Breaking Boxes With CSS Fragmentation. Свежая статья Rachel Andrew о новой спецификации CSS•
Воссоздание градиентного эффекта Facebook Messenger с помощью CSS•
Детальный обзор принципов работы CSS селекторов + шпаргалка•
Менее известные CSS свойства в GIF•
8 маленьких видео о редакторе Shape Path Editor в Firefox•
Победят ли пользовательские свойства CSS циклы Sass?•
Смотри-ка, никаких медиа-запросов! Адаптивные макеты с использованием CSS Grid
JavaScript
•
Wolfensteiny 3D — реверс-инжиниринг 251 байтов JavaScript• Google запускает серию видео на тему SEO для JavaScript
• FunES#9: загадка. Фокусы с JavaScript
•
Релизы: Apollo Client 2.5, Ember 3.8, GSAP 2.1•
Как писать простые современные JavaScript-приложения с использованием Webpack и прогрессивных веб-технологий•
Понимание проблемы производительности с “полиморфическими” JSON данными- Теория:
• 5 советов как лучше писать условные конструкции в JavaScript
• 12 концепций JavaScript, о которых нужно знать
• Полное руководство по циклам в JavaScript
• Какая наиболее длинная последовательность ключевых слов в Javascript?
• Полное руководство по коллбекам
React:
• Эффективное создание компонентов с помощью styled system
• Мы перешли на Next.js, чтобы обрабатывать нашу домашнюю страницу в 7,5 раз быстрее
• Повышение производительности в функциональных компонентах React с помощью React.memo ()
• Как «золотое правило» компонентов React может помочь вам писать лучший код
• Написание тестов для React-приложений с использованием Jest и Enzyme
• Объяснение Redux-а за 1 минуту
• 8 причин использовать styled-components
React:
VueJS:
• Повышаем производительность разработки на примере Vue — часть 2
• Оптимизация производительности приложения Vue.js, часть 1: Введение в оптимизацию производительности и ленивую загрузку
• Sliding In And Out Of Vue.js. Подробная статья об одном из преимуществ Vue — легкой прогрессивной интеграции с другим JS
• Создание пользовательских директив в Vue.js
• Еще один пример абстрактного компонента в Vue.js
VueJS:
Angular:
• MVC в мире Angular
• Анонс Angular Loadable (ngx-loadable ~ 2.2kB)
• Как передавать файлы и данные между клиентом на Angular и бекендом на Node.js
Angular:- Libs & Plugins:
• FrenchKiss.js — сверхбыстрая и легкая библиотека для интернационализации, работающая как в браузере, так и в среде NodeJS
• terser — JavaScript парсер и mangler/compressor инструментарий для ES6 +.
• cnbuilder — Yet another classname string builder
• Zero Server: zero configuration web framework
• npmf: быстро подтягивает информацию об npm пакете прямо в терминал
Браузеры
• 0Day-уязвимость в Chrome используется для кражи данных
• В Firefox 67 появится страница about:compat и выгрузка вкладок при нехватке памяти
• Google ускоряет Chrome с новой функцией кэширования открытых страниц
• В Firefox появится режим картинка в картинке и переработанный менеджер дополнений
•
Хром больше не нужен
Занимательное
• Google открыла регистрацию доменов в зоне .dev для всех желающих
• Нейросеть научили подделывать голоса
• «Нашумевшая китайская система социального рейтинга на практике далека от новых технологий»
• Самые значимые события в отрасли искусственного интеллекта в 2018 году
• Узнаете ли вы язык программирования по коду для «Hello, World!» — тест по экзотическим языкам
• Компания Mozilla опубликовала голосовые данные Common Voice
• Линус Торвальдс не верит, что серверы на ARM-архитектуре заменят x86. «Продавать 64-битную модель — идиотизм»
• Новые языки программирования незаметно убивают нашу связь с реальностью
Просим прощения за возможные опечатки или неработающие/дублирующиеся ссылки. Если вы заметили проблему — напишите пожалуйста в личку, мы стараемся оперативно их исправлять.
Дайджест за прошлую неделю.
Материал подготовили dersmoll и alekskorovin.
