Восьмая нода официально релизнулась и будет поддерживаться минимум до декабря 2019го. Изменения в основном внутрненние и будут малоинтересны. Плюс npm 5 и несколько фич JS за флагом. В библиотеку добавили много полезных мелочей. Например util.promisify(original).

Как и ожидалось хром выключит поддержку PNaCl в пользу WebAssembly.

react-virtualized отрисовка больших списков в реакте.

Доброе утро!

Подробная статья о том как правильно делать длинные страницы. Много примеров и советов. Отдельно вынесены советы для e-commerce сайтов. Крайне рекомендую.

Заметка про особенности flexbox. И более менее читаемый перевод.

Релиз Storybook 3.0. Теперь поддерживает webpack2 из коробки.

Заметка о P2P стриминге видео в браузере. Пока работает криво, но сама идея интересна.

Birdview.js — библиотка для показа "обзорного вида" сайта. Может пригодиться на длинном лендинге.

Видео с JSConf EU 2017. Будет чем заняться на выходных. Если вы уже смотрели и знаете, кикие доклады стоящие, а какие не очень, напишите мне (@slonoed).

Доброе утро и хорошей недели!

Статья о причинах появления Google AMP. + Перевод
Если кто не в курсе, то AMP — это приём позволяющий гуглу инлайнить сайт в мобильной выдаче. По сути гугл плюёт на стандарты, делая свой веб. И винить его в этом сложно: современные сайта ужасно работают на мобилках.

Практическая статья с набором из пяти техник для ленивой загрузки изображений.

Пример хорошо сделанной навигации по тексту станицы. Обратите внимание, что размер маркера зависит от высоты экраны.

Видео докладов с MoscowJS. Мне очень понравился доклад "Цена пропущеного фрейма". Расказали про хитрые техники и подходы в оптимизации рендера. Доклад про TS+Webpack интересен тем, что у автора действительно большой проект, в котором время сборки уже критично.

Гугл решил бороться с рекламой. В дополнение к AMP (о котором была статья вчера), обнародованы планы о блокировке рекламы в хроме. Не всей, а той, которая не проходит по гайдам. Пост в блоге гугла и статья на русском.

Доброе утро, сегодня про новости браузеров.

Chrome 59.
Теперь headless режим в стабильной ветке. Уведомления на macOS нативные вместо уродливых. И добавили API для взаимодействия с камерами.

Safari Technology Preview 31.
В основном изменения небольшие, но некоторые могут быть крайне полезны, если вы с ними работаете.

Firefox 54 релизнется через неделю. Изменений много, но они все небольшие. А вот изменения devtools показательны. FF перенимает правильные фишки из хрома.

Доброе утро.

Сегодня я посоветую только одну статью, про то как создавать эффективные формы.
Designing Efficient Web Forms. Также доступен перевод.
Не пожалейте времени и прочитайте — оно того стоит.

Позавчера была конференция WWDC, где Apple представили IOS11. С ним идёт и новый Safari. Из интересного: WebRTC и WebAssembly

Сравнение производительности Nodejs 6 и 8 на реальном react приложении.
Новая нода получила хороший прирост в производительности. 30% для вывода реакт дерева в строку.

Советы по написанию современного CSS. Набор заметок про хорошие практики. Расчитана на начинающих, но лично я себе добавил в закладки.

Чтение на выходные, большой набор ссылок по react+redux.

Хороших выходных, увидимся в понедельник в 9:00 (:

Доброе утро!

Набор техник для работы с консолью в браузере. Полезно знать.

Небольшая заметка про фильтры цвета в CSS. + Перевод

Пошаговое введение в Preact.

billboard.js — небольшая и шустрая библиотека для построения графиков. Загляните в примеры, выглядит очень достойно.

Доброе утро, вчера совсем забыл про выходной (:

Небольшая заметка про выбор Flow vs Typescript. Для себя я определил правило: новый проект — TS, существующий — Flow.
Так же доступен перевод этой статьи.

Чеклист для проверки сайта перед запуском. Поможет не забыть о мелочах.
И заодно чеклист доступности (если вы это используете).

Вы, наверное, уже видели хайп вокруг приватных полей класса. Выглядит как необоснованное усложнение. Как и в случае с типами, усложнения только добавляют ошибок. К тому же у нас есть достаточно вариантов для скрытия полей класса.

Доброе утро, сегодня несколько обновлений.

Свежая версия v8 (6.0). Производительность + пара фич:
• SharedArrayBuffer позволит иметь доступ к памяти из разных потоков и делать ещё больше ошибок. Это может быть полезно при портировании мультипоточных программ на webassembly. Подробнее про эти штуки.
• rest/spread объектов, действительно полезное улучшение синтаксиса.

В новой версии Edge также добавили работу с памятью из разных потоков, CSS свойста (например position:sticky) и некоторые фичи самого UI.

Eslint 4. Новые правила, новые автофиксы. Есть небольшие проблемы с обратной совместимотью.

Доброе утро (:

Гайд по мгновенной загрузке всего от Эдди Османи. Если вас беспокоит начальная загрузка вашего приложения (скорее всего так и есть), крайне рекомендую.

Результаты опроса про CSS. В конце есть краткая выжимка.

Credential Management API в хроме. Для меня выглядит как дыра в безопасности, но может быть полезно.

Статья в блоге гугла про оптимизацию загрузки и производительности в целом. Есть интересные подходы, например использование аналитики для проверки времени.

Бета версия хрома принесла много интересных изменения. Например, Payment Request API позволит запрашивать оплату унифицированым способом. Наверняка в будущем прикрутят привязку Apple Pay и похожих сервисов. Budget API открывающий дорогу к задачам в фоне. font-display свойство даёт контроль над показом загружающихся шрифтов. И многое другое — стоит ознакомиться.

Очередной бандлер FuseBox. Не знаю зачем он нужен когда есть вебпак 😄. Но если интересно, то есть введение.

Хороших выходных! Следующее сообщение в понедельник в 9:00.

Доброе утро!

Пока допиваете свой кофе: первая статья 🇬🇧 цикла про войну браузеров. Плюс перевод 🇷🇺.

Bonsai — анализатор вебпака от команды Pinterest. Имеет некоторые преимущества перед анализитором на сайте вебпака.

ZangoDB — обёртка над IndexedDB в стиле монги. Что-то в этом есть, учитывая уродство интервфейса IndexedDB.

Доброе утро!

Фунциональное программирование в JS — антипатерн. Громкое название для достаточно хорошей статьи, сравнивающей JS и Clojurescript.

Webpack 3.0. Главной фичей стало заявление о коротком релизном цикле и отсутствии несовместимости. Добавили Scope Hoisting, который позволит не оборачивать модули в функции (как у rollup). За новые фичи можно голосовать.

collect.js — набор методов для работы с коллекциями.

Продолжаю переводить ститьи из цикла про браузерные войны. Вторая часть рассказывает о победе MS над Netscape.

Статья про lock-файлы в новом npm. Так и не убедили зачем оно нужно, когда есть shrinkwrap.

p-queue — библиотека для работы с асинхронщиной. На случай, если у вас действительно сложные пайплайны в коде.

Доброе утро, сегодня про анимацию

А вы уже пробовали animation API? Отлично работает с CSS in JS подходом. Поддержка пока не велика, но уже можно поиграться. Есть хорошая статья для старта.

Если предпочитаете другой путь, то вот статья про сложную анимацию без JS. Обратите внимание на пример.

Обалденное видео про то, как рисовать с помощью CSS.

В свежем билде для девелоперов Edge получил поддержку гридов за флагом.

Большая статья про гриды в продакшене, много практической информации.

Web bluetooth. Зачем он нужен и как его использовать. Пока применения надуманные, но со временем станет повсеместным. Представте себе, вы заходите в магазин, открываете сайт магазина, а там уже показаны товары конкретно этого филиала.

До встречи в понедельник, в 9:00 по Москве.

Доброе утро!

Заметка про декомпозицию React компонентов. Автор предлагает несколько правильных вариантов.

Практический пример реализации двухфакторной авторизации на ноде.

Как сделать приложение про погоду в 16 строк кода nodejs. Неплохая практическая заметка как в введение в ноду.

react-day-picker — очень милый календарик на реакта с хорошей кастомизацией.

Доброе утро! На сегодня несколько небольших статей.

Я присматриваюсь к reasonml как к перспективной технологии. Но пока она явно сырая. Но вот один из контрибьюторов пишет, что ждать полгода. Может и вам пора присмотреться ;)

Небольшая заметка об async/await как о лучше фиче JS. Тут я автора поддерживаю.

Практическое введение в Set.

Прогрессивные веб приложения на Ember. Небольшой, но хороший гайд. Будет полезен тем, кто использует Ember.