Breakfast.js

@breakfastjs Нравится 0
Это ваш канал? Подтвердите владение для дополнительных возможностей

Подборка статей и ссылок из мира фронтенд разработки. Каждый день в 9:00 по Москве. Канал ведёт @slonoed
Больше ссылок http://sld.fun/bjs
Гео и язык канала
Россия, Русский
Категория
Технологии


Гео канала
Россия
Язык канала
Русский
Категория
Технологии
Добавлен в индекс
19.06.2018 13:19
реклама
TGStat Bot
Бот для получения статистики каналов не выходя из Telegram
SearcheeBot
Ваш гид в мире Telegram-каналов
Telegram Analytics
Подписывайся, чтобы быть в курсе новостей TGStat.
2 624
подписчиков
~0
охват 1 публикации
~21
дневной охват
N/A
постов в день
N/A
ERR %
0.83
индекс цитирования
Репосты и упоминания канала
13 упоминаний канала
0 упоминаний публикаций
4 репостов
Вебня
EPAM LAB
1С+web+mobile+etc
1С+web+mobile+etc
UfoStation
Новые каналы
Senior Software Vlogger
UfoStation
Вебня
frontends don't lie
КАК СТАТЬ СТО
Естественный обзор
Типичный программист
Telegram Group List
webo_ru
Каналы, которые цитирует @breakfastjs
Juliarderity
Вебня
Веб-стандарты
IT Radio Streams
Последние публикации
Удалённые
С упоминаниями
Репосты
Breakfast.js 7 Jun 2019, 09:00
Доброе утро!

Изменения в работе Payment Request API для Apple Pay. Теперь можно показывать более точные ошибки.
https://webkit.org/blog/9167/whats-new-in-the-payment-request-api-for-apple-pay/

В новой iOS для iPad Safari будет пытаться эмулировать десктопный браузер по поведению. Если вы делаете интерактивный сайт, и в вашей аудитории есть пользователи айпадов, то есть смысл проверить заранее как оно работает7
https://webkit.org/blog/8993/cpu-timeline-in-web-inspector/

Небольшая заметка про то, почему использование CSS переменных предпочтительнее, чем использование переменных препроцессора (например, SASS)
https://codyhouse.co/blog/post/css-custom-properties-vs-sass-variables
Читать полностью
Breakfast.js 6 Jun 2019, 09:00
Доброе утро!

Вышла бета Safari 13 (можно скачать как TP 84). Там много апдейтов, лучше самим посмотреть. Интересное для меня: отмена fetch запроса, улучшена защита от трекинга, Pointer Events API, ES6 imports.
https://developer.apple.com/documentation/safari_release_notes/safari_13_beta_release_notes

Довольно милая библиотека для анимаций. Поддерживает разные эффекты, CSS и JS анимацию.
http://daybrush.com/scenejs

Google анонсировали изменения в Chrome, которые сделают блокировщики рекламы и трекинга менее эффективными, но при этом это не коснётся пользователей платной корпоративной версии. Первые неприятные последствия монополии браузера.
https://www.theregister.co.uk/2019/05/29/google_webrequest_api/
Читать полностью
Breakfast.js 4 Jun 2019, 09:00
Доброе утро!

Интересный подход к группировке элементов с помощью CSS grid. Суть в том, что плоский список элементов можно разбить на колонки по типу с помощью стилей.
https://css-tricks.com/using-the-grid-shepherd-technique-to-order-data-with-css/

Статья про CI в Яндексе. Для маленьких команд такой подход точно оверхед, но вот отдельные практики можно использовать. Там есть ещё продолжение с внутренними деталями.
https://habr.com/ru/company/yandex/blog/428972/

Просто хорошая новость. Команды и W3C и WHATWG наконец смогли договориться друг с другом и настроить хоть какой-то процесс взаимодействия. В идеале это должно значить, что стандарты будут меньше отставать от браузеров.
https://css-live.ru/vecssti-s-polej/w3c-i-whatwg-neuzheli-dolgozhdannyj-mir.html
Читать полностью
Breakfast.js 3 Jun 2019, 09:00
Доброе утро!

Руководство по использованию IntersectionObserver для реализации ленивой загрузки изображений.
https://habr.com/ru/company/ruvds/blog/453586/

Заметка про доступность. Можно исправить 85% проблем с доступностью сделав всего пять типов изменений в коде. Только один из них (контрастность) требует какого либо изменения в дизайне.
https://dev.to/alvaromontoro/fix-85-of-your-web-accessibility-issues-in-5-easy-steps-pnf

Статья в которой автор рассказывает почему статические файлы нужно раздавать с подконтрольного вам домена и как оптимизировать такую статику.
https://csswizardry.com/2019/05/self-host-your-static-assets/
Читать полностью
Breakfast.js 28 May 2019, 09:00
Доброе утро!

На GitHub добавили возможно переводить деньги людям, работающим над проектами. Хорошо, что появился простой способ отблагодарить людей, делающих полезные вещи.
https://habr.com/ru/post/453272/

Небольшой скрипт, позволяющий определить находится ли пользовать в режиме инкогнито. Удивительно, что браузеры не спешат закрыть эти дырки.
https://github.com/yankouskia/is-incognito-mode

Забавная Tower Defense игра, где вы играете, с помощью написания CSS. Цель игры — научиться работать с Flexbox.
http://www.flexboxdefense.com
Читать полностью
Breakfast.js 27 May 2019, 09:00
Доброе утро!

Хороший пример использования WebAssembly от команды eBay. Они использовали WASM для компиляции C++ библиотеки для распознавания штрих-кодов.
https://www.ebayinc.com/stories/blogs/tech/webassembly-at-ebay-a-real-world-use-case/

Туториал по работе с Google Sheets из NodeJS. Может быть вполне полезно как небольшая БД, которую можно редактировать руками. Или выводить отчёты.
https://blog.stephsmith.io/tutorial-google-sheets-api-node-js/

Большая статья про создание сложных таблиц (доступность, маленькие экраны и так далее).
https://www.smashingmagazine.com/2019/02/complex-web-tables/
Читать полностью
Breakfast.js 23 May 2019, 09:00
Доброе утро!

В новом Firefox (67) теперь тоже поддерживается prefers-color-scheme и сайт может реагировать включенную тёмную тему в системе. Теперь дело за дизайнерами сайтов.
https://hacks.mozilla.org/2019/05/firefox-67-dark-mode-css-webrender/

Если вы используете AWS Lambda и используете JS, то проверьте, что обновились на верную 8 или выше. Шестая больше не поддерживается.
https://aws.amazon.com/ru/blogs/developer/node-js-6-is-approaching-end-of-life-upgrade-your-aws-lambda-functions-to-the-node-js-10-lts/

Руководство по созданию IO игр. Это простые мультиплеерные игры в браузере для большого количества игроков. Самой известно была agar.io.
https://habr.com/ru/post/450574/
Читать полностью
Breakfast.js 22 May 2019, 09:00
Доброе утро!

Официальная canary версия браузера Edge для MacOS. Я очень сомневаюсь, что у неё будет хоть сколько нибудь пользователей, но проверить, что ваш сайт открывается и работает стоит (скорее всего всё ок, ведь это Chromium).
https://blogs.windows.com/msedgedev/2019/05/20/microsoft-edge-macos-canary-preview/

Новый формат BinaryAST, который позволит отправлять не JS, а уже разобранное синтаксическое дерево. Таким образом браузер пропускает фазу парсинга, что даст прирост в скорости начала работы сайта. В отличие от WebAssembly этот подход очень легко наложить на уже имеющиеся проекты,
https://www.opennet.ru/opennews/art.shtml?num=50701

Разбор внутреннего устройства JPEG картинок. Это скорее теория и может быть не всем интересна.
https://parametric.press/issue-01/unraveling-the-jpeg/
Читать полностью
Breakfast.js 21 May 2019, 09:00
Доброе утро!

Статья из двух частей на русском, про то как создать PWA из вебсайта и выложить его в Google Play. Внизу там много полезных ссылок по теме.
https://habr.com/en/company/mailru/blog/450504/

Google Fonts теперь поддерживает указание font-display для загружаемого шрифта. Для сайтов, которые изначально беспокоились об оптимизации и имели шрифты у себя, поводов переходить на Google Fonts нет. А вот для остальных сайтов фича приятная.
https://scotch.io/bar-talk/google-fonts-now-supports-font-display

Я написал руководство по созданию пользовательских правил для eslint. Полезная практика, которую я использую в своих проектах.
https://slonoed.net/ru/custom-eslint-rule/
Читать полностью
Breakfast.js 20 May 2019, 09:00
Доброе утро! Последнее время выпуски не отличались стабильностью. Постараюсь быть более регулярным.

Читатель канала прислал ссылку на своё руководство про трекинг ошибок в React приложениях с помощью Sentry. Логирование ошибок должно быть в проекте изначально, а Sentry отличный вариант для старта.
https://hackernoon.com/tracking-errors-in-react-app-with-sentry-d6091a84b64e

Руководство по использованию атрибута inputmode, который позволяет браузеру показать наиболее подходящий способ ввода. Главное применение — выбор клавиатуры на телефоне. Многие сайта почему то забывают про эту фичу.
https://css-tricks.com/everything-you-ever-wanted-to-know-about-inputmode/

Новость важная для веба в целом. Поисковый бот Google будет использовать Chrome последней версии. Это означает, что не нужно думать про необходимость работать в старом браузере только из-за индексирования. Если кто знает как дело обстоит с Яндексом — поделитесь.
https://webmasters.googleblog.com/2019/05/the-new-evergreen-googlebot.html
Читать полностью
Breakfast.js 7 May 2019, 09:00
Доброе утро! Сегодня новости про Microsoft.

Microsoft запускают Visual Studio Online — веб версию VS Code, работающую в браузере. Браузерные редакторы и IDE существуют уже давно, но пользоваться ими крайне сложно. Может сейчас получится лучше. Хотя позиционируют его не как полноценную рабочую среду, а как приложение-компаньон.
https://devblogs.microsoft.com/visualstudio/intelligent-productivity-and-collaboration-from-anywhere/

Релиз Edge на MacOs. Выглядит как Chrome. Работает также. Зачем? Видимо, чтобы было.
https://www.theverge.com/2019/5/6/18528881/microsoft-edge-macos-mac-browser-teaser-build-2019

React Native для Windows. Позволяет писать приложения для десктопов, мобильных, Xbox, и всего, что на Windows 10.
https://github.com/microsoft/react-native-windows
Читать полностью
Breakfast.js 6 May 2019, 09:00
Доброе утро!

Небольшая заметка про “Идеальный юнит тест”. Набор небольших правил призванных сделать тесты более читаемыми.
https://javascriptplayground.com/the-perfect-javascript-unit-test/

На днях в Firefox отвалились все расширения. Это было связано с истекшим сертификатом. При разработке сайтов мы редко связываемся с ситуациями, когда сломанный билд нельзя быстро откатить. Ведь пользователю всего лишь нужно перезагрузить страницу. Но уже есть инструменты (Service workers, AMP) в которых апдейт занимает долгое время, и надо быть очень аккуратным с выкатыванием апдейтов.
http://www.opennet.ru/opennews/art.shtml?num=50623

Новости AMP. Там много нового, но самое интересное – это поддержка  Signed HTTP Exchanges. Для AMP эта штука дает возможность показывать URL сайта в строке браузера (вместо google.com). Но на деле её применение шире: дистрибуция подписанных сайтов не с сервера самого сайта.
https://webplatform.news/issues/2019-04-29
Читать полностью
Breakfast.js 30 Apr 2019, 09:00
Доброе утро!

Подробный разбор часто используемых заголовков HTTP ответа. Это та информация, которую нужно знать при работе с вебом.
https://www.twilio.com/blog/a-http-headers-for-the-responsible-developer

Игра, где нужно повторить фигуры с помощью CSS, используя минимальное количество кода. Есть глобальный рейтинг.
https://cssbattle.dev

Новая версия фреймворка Svelte. Его фишка в том, что там происходит очень много кодогенерации на этапе компиляции. В посте есть видео, где Rich Harris рассказывает как это всё работает и почему было сделано. Пока это всё не выглядит как готовое решение для продакшена, но сам подход интересный.
https://habr.com/en/post/449450/
Читать полностью
Breakfast.js 29 Apr 2019, 09:00
Доброе утро! Я вернулся, а значит встречайте утренние подборки новостей.

Руководство по использованию модулей в NodeJS 12. Там есть несколько неочевидных моментов, которые отличаются от того как работает с модулями, например Webpack. Бросаться переделывать ничего не надо, но начать писать код с учетом стандарта полезно, и убережет вас от миграции в будущем.
http://2ality.com/2019/04/nodejs-esm-impl.html

Хороший гайд по отладке проблем производительности анимаций. По шагам показывают как определить узкие места.
https://www.viget.com/articles/animation-performance-101-measuring-with-dev-tools/

Начиная с Chrome 74 (который уже релизнулся), JS классы поддерживают приватные поля.
https://developers.google.com/web/updates/2019/04/nic74
Читать полностью
Breakfast.js 18 Apr 2019, 09:00
Доброе утро!

Подробности о том как работают AMP с URL оригинального сайта. По сути сайт запаковывается в архив и подписывается сертификатом. После чего поисковики (и не только) могут раздавать такой архив, а браузер проверять оригинальность контента. Меня удивляет как быстро это внедряют. Видимо очень нужно Google.
https://blog.cloudflare.com/announcing-amp-real-url/

Большой гайд про использование preload. В целом полезно всем.
https://www.smashingmagazine.com/2016/02/preload-what-is-it-good-for/

Подробности Safari TP 80. Добавили ResizeObserver, noreferrer (я думал уже давно есть). Ещё запретили старый формат распространения расширений (в виде пакетов). В остальном мелочи.
https://webkit.org/blog/8825/release-notes-for-safari-technology-preview-80/

Я ухожу в отпуск, так что новостей пока не будет. Встретимся через неделю. Удачи!
Читать полностью
Breakfast.js 17 Apr 2019, 09:00
Доброе утро!

Хорошая заметка на русском про использование директивы @supports в CSS. Пойдёт тем, кто решил разобраться в этой фиче.
https://medium.com/webbdev/css-264fc77cc04

Есть шансы, что в Chrome появится ленивая загрузка iframe. Если вам интересна эта тема, то больше деталей в треде по ссылке.
https://groups.google.com/a/chromium.org/forum/#!topic/blink-dev/jxiJvQc-gVg

Вышла новая Opera. Сомневаюсь, что он займёт большую долю когда-либо, однако по старой памяти люди могут его начать устанавливать. Плюс наличие встроенного VPN.
https://itc.ua/news/vyishla-opera-60-reborn-3-pervyiy-desktopnyiy-brauzer-c-podderzhkoy-interneta-budushhego-web-3-kriptokoshelkom-i-besplatnyim-vpn/
Читать полностью
Breakfast.js 16 Apr 2019, 09:00
Доброе утро!

Интересная статья от Яндекса про создание темной темы для почты. Особенность в том, что они перекрашивают не только интерфейс, но и сами письма.
https://habr.com/ru/company/yandex/blog/446780/

Обратный взгляд на AMP страницы. Если ваш сайт и так сделан нормально, то грузится он будет быстрее. В целом статья больше про боль от того, что Google перекраивает интернет по своему, чем про конкретные вещи.
https://unlikekinds.com/article/google-amp-page-speed

Небольшой тест на проверку знаний CSS селекторов. Я ответил правильно лишь на половину 😩
https://codepen.io/pehaa/full/ROapJZ
Читать полностью
Breakfast.js 15 Apr 2019, 09:00
Доброе утро!

На днях открыл для себя альтернативу Storybook: Docz. Позволяет писать документацию в Markdown, вставляя внутрь React компоненты. В отличие от Storybook нет такого богатого набора плагинов, но базовая функциональность уже хорошая. Отлично подходит для документации к компонентам.
https://www.docz.site/

Пост в блоге WebKit про трекинг клика ссылок. Они там объяснят, почему не хотят просто отключить атрибут ping: иначе сайты начнут использовать другие методы, ухудшающие пользовательский опыт.
https://webkit.org/blog/8821/link-click-analytics-and-privacy/

API для работы с Google Translate из NodeJS.
https://github.com/googleapis/nodejs-translate
Читать полностью
Breakfast.js 12 Apr 2019, 09:00
Доброе утро!

Большая вводная статья про GraphQL на русском. К сожалению, основные проблемы и их решения там не описаны, но для понимания базовых вещей отлично подойдёт.
https://habr.com/en/company/ruvds/blog/445268/

Система сборки фронтенда для WordPress. Предоставляет структуру проекта, препроцессоры для JS и CSS. Использует gulp. Мне сложно сказать, насколько легко это встраивается в сам Wordpress, но если вы работаете с этой CMS, то может быть интересно.
https://www.wordpressify.co/

Вводная статья на русском про регулярные выражения. Будет, в основном, полезна начинающим.
https://proglib.io/p/dont-fear-regex/
Читать полностью
Breakfast.js 11 Apr 2019, 09:00
Доброе утро!

ReasonReact получил новый JSX синтаксис, который позволяет писать функциональный компоненты с хуками в виде, близком к тому, что имеем в JS. И при этом со звучащей системой типов.
https://reasonml.github.io/reason-react/docs/en/components

Хорошая статья на русском про кэширование в JS движках. Для тех, кому интересно как устроено внутри.
https://habr.com/ru/company/otus/blog/446446/

Подробности и немного примеров использования нового API для взаимодействия с устройствами через USB и Bluetooth.
https://blog.scottlogic.com/2019/04/03/upcoming-webhid-api.html
Читать полностью