For Web — фронтенд, дизайн, программирование

Что фронтендерам нужно знать о числах

Как числа хранятся в памяти компьютера, почему 0.1 + 0.2 не равняется 0.3, как в JavaScript не облажаться с большими числами и о каких тонкостях NaN и Infiinity стоит помнить → https://medium.com/p/8d59199db1b6

Как улучшить UX страницы 404 и отследить ошибки, из-за которых пользователи на неё попадают, обзор Шелби Роджерс → https://www.smashingmagazine.com/2018/11/the-101-course-on-crafting-404-pages/

Squoosh, опенсорсное PWA от инженеров Google для ресайза, оптимизации и конвертации изображений с помощью популярных кодеков, скомпилированных в WebAssembly → https://squoosh.app/

Исходники → https://github.com/GoogleChromeLabs/squoosh/

Elm изменил моё представление о непопулярных языках: заметка Александра Кэмпбэлла по мотивам знакомства с проектом на Elm в переводе Девшахты → https://medium.com/p/fa13b7ae2472

Пошаговый пример создания компилируемого в WebAssembly фреймворка на golang для разработки SPA → https://tutorialedge.net/golang/writing-frontend-web-framework-webassembly-go/

Исходники для нетерпеливых → https://github.com/elliotforbes/oak

От текстовой разметки к DOM

Как браузер парсит загруженную разметку, как строит из неё DOM и какие API для работы с ней предоставляет разработчикам, подробный обзор Тревиса Лейтхеда → https://alistapart.com/article/tags-to-dom

🎧
Свежие подкасты

«SPB Дринкаст» №29: фронтенд по-американски со Степаном Коршаковым → https://spb-frontend.ru/podcast/29

Frontend Weekend №78, в гостях Антон Черноусов: о переходе из программирования в менеджмент и подкастинге → https://soundcloud.com/frontend-weekend/fw-78

«Фронтенд-юность» №71, на работу к Илону Маску через ректальные хуки: Reactive Conf, новая версия JS в Nginx, взлом Telegram → https://soundcloud.com/frontend_u/e71

«Веб-стандарты» №146, в гостях Алексей Золотых и Стас Курилов: веб-приложения на десктопе, безопасность и фронтопсы, Test262, Babel и Webpack, вопросы к HolyJS → https://medium.com/p/dd34f9b8f12a

«Девшахта» №56, в гостях Илья Кашлаков: NodeConf EU 2018 → https://soundcloud.com/devschacht/devschacht-56

«Пятиминутка React» №49, в гостях Владимир Гриненко из Яндекса: все детали о свежем релизе bem-react-core v3 → https://5minreact.ru/49-bem-react-core/

«Новости 512» от CSSSR №28: обзор новостей, релизов и интересных публикаций → https://soundcloud.com/csssr/novosti-512-vypusk-28-0511-1111

Краткая история дизайна календаря: какими были первые календари и как они пришли к нынешнему виду → https://uxdesign.cc/c3f876689fed

fx, CLI-утилита для удобного просмотра и преобразования JSON-файлов с помощью JavaScript → https://github.com/antonmedv/fx

rawact, вдохновлённый Svelte экспериментальный компилятор React-компонентов в нативные DOM-инструкции для получения меньшего количества кода, чем при подключении react-dom → https://github.com/sokra/rawact

react-dom содержит код, реализующий кастомную систему событий, инкрементальную отрисовку и множество других фич, которые могут не использоваться в вашем приложении. Подход Svelte и rawact позволяет получить на выходе только используемый приложением код.

Прокачиваем навыки отладки с помощью инструментов разработчика Chrome

Руководство Питера Милчева в переводе CSS-Live.

Часть 1, основы → http://css-live.ru/faq/prokachivaem-navyki-otladki-s-pomoshhyu-instrumentov-razrabotchika-chrome-chast-1.html

Часть 2, продвинутые техники → http://css-live.ru/faq/prokachivaem-navyki-otladki-s-pomoshhyu-instrumentov-razrabotchika-chrome-chast-2.html

47 видео с ReactiveConf 2018: доклады, панельные дискуссии и AMA-секции → https://www.youtube.com/playlist?list=PLa2ZZ09WYepPQAIo1h98LaPkQUYwaSbWO

Три ошибки инженеров в продажах

Любой инженер сталкивается с продажами, будь то «продажа» придуманной фичи продакт-менеджеру или продажа собственного продукта пользователям. Джефф Фергюсон рассказал, какие при этом ошибки совершает большинство инженеров и как их избежать → https://www.pipelinedb.com/blog/three-sales-mistakes-software-engineers-make

Забытая история ООП

Эрик Эллиот в переводе на Хабре об истоках ООП, популярных заблуждениях и о том, почему JavaScript к ближе к ООП, чем С++ → https://habr.com/p/428582/

От сервера к клиенту: как браузер загружает страницы/ресурсы и как на загрузку влияют сервис-воркеры, механизмы кеширования и origin model? Подробное объяснение Али Алабаса → https://alistapart.com/article/server-to-client

Как реализовать хорошую тёмную тему, советы Энди Кларка по мотивам редизайна его собственного сайта → https://stuffandnonsense.co.uk/blog/redesigning-your-product-and-website-for-dark-mode

Рецепт оптимизации веб-перформанса от Netflix:
1. Сделайте лендинг на Реакте.
2. Зафиксируйте метрики быстродействия.
3. Осознайте, что для лендинга Реакт нужен максимум в качестве серверного шаблонизатора.
4. Удалите Реакт из клиентского бандла.
5. Снова зафиксируйте и сравните метрики быстродействия.
6. Профит: хвастайтесь красивыми цифрами и ждите статью о вашем успехе от сотрудников Google.

Оптимизация быстродействия основного лендинга Netflix, подробный рассказ Эдди Османи: время загрузки и TTI уменьшились на 50%, предзагрузка ресурсов сократила TTI после переходов между страницами на 30%, JS-бандл лендинга уменьшился на 200 КБ → https://medium.com/p/c0bcde26a9d9

Запись видео с эффектом бумеранга на JavaScript, руководство Пола Кинлана → https://paul.kinlan.me/simple-boomerang-video/

PostCSS исполнилось пять лет: Андрей Ситник об истории создания проекта, достижениях сообщества и планах на будущее → https://evilmartians.com/chronicles/five-years-of-postcss-state-of-the-union