Интерактивный гайд по CRDT

Благодаря CRDT можно легко создавать приложения с совместным редактированием, такие как Google Docs, но без необходимости подключаться к серверу.

В этой серии статей мы узнаем, что такое CRDT. Затем напишем простой редактор, объединим его с более сложными структурами данных и, наконец, применим то, что мы выучили, чтобы создать совместный редактор, похожий на Paint в онлайне.

https://jakelazaroff.com/words/an-interactive-intro-to-crdts/

#typescript #crdt

@tproger_web
Читайте также в VK и Max

Navigation API — удобный способ навигации,​ теперь доступен в базовой версии во всех основных браузерах

Наконец-то стал доступен официальный роутер для SPA без хаков на history.pushState. Десятилетия жалоб на History API позади.

Всё упрощается до одного слушателя navigation.addEventListener('navigate'), который ловит клики по ссылкам, формы, back/forward и даже programmatic navigation.navigate(). event.intercept() автоматически обновляет URL, историю, фокус (a11y), а ты просто рендеришь контент в handler().

Примеры и подробности в статье.

@tproger_web
Читайте также в VK и Max

WebKit анонсировал Interop 2026

Сделать так, чтобы ваш сайт работал во всех браузерах, может быть непросто, особенно если браузерные движки реализуют одну и ту же веб-технологию немного по-разному. Проект Interop решает эту проблему, объединяя основные браузерные движки для улучшения одного и того же набора функций в течение одного года. Interop 2026 — это уже пятая итерация совместного проекта браузерных движков (Apple/Safari, Google/Chromium, Microsoft/Edge, Mozilla/Firefox, плюс Igalia) по повышению кроссбраузерности веба.

В этом году 20 фокусных областей (15 новых, 5 carryover). Подробнее в статье.

#новости

@tproger_web
Читайте также в VK и Max

Возьмут, чтобы узнать продолжение

@tproger_web
Читайте также в VK и Max

Как вам формат TOON (Token-Oriented Object Notation) вместо JSON?

Массивы объектов объявляются один раз в заголовке users[2]{id,name,role}:, а дальше идут только данные через запятую без лишних скобок и ключей. Это сокращает объём данных на 30–60%.

Для Python уже есть готовые библиотеки, например python-toon и toons. Для промтов в ИИ экономия токенов. Для людей на глаз вроде тоже проще читается.

С другой стороны это просто CSV с дополнением, вложенности не очень удобно делать. Что думаете?

@zen_of_python, также в Max

Сравнение golang веб-фреймворков 2026 года: топ-5 лучших вариантов

Не можете выбрать веб‑фреймворк для проекта на Go? Мы сравнили топ‑5 вариантов 2026 года: Gin, Fiber, Echo, Chi и Beego! Разбираем плюсы, минусы и сценарии использования — читайте и выбирайте лучший!

#golang

@tproger_web
Читайте также в VK и Max

Регулярные выражения простыми словами

Автор статьи делит разработчиков на два типа: тех, кто понимает регулярные выражения и решает сложные задачи одной строкой, и тех, кто все еще боится и всячески их избегает.

В своем материале он постарался помочь вторым стать первыми.

Если вас тоже начинает бросать в холодный пот при виде hello(\s*,\s*|\s+)world, то эта статья явно будет вам полезна:

https://habr.com/ru/companies/selectel/articles/848114/

@tproger_web
Читайте также в VK и Max

UI-паттерны для асинхронных задач и пайплайнов

Статья на LogRocket разбирает, как бороться с неопределённостью пользователей во время фоновых задач — импорт файлов, обновления, ETL-пайплайны. Главная идея: делайте невидимую работу видимой, чтобы юзеры не паниковали от спиннеров с загрузкой.

@tproger_web
Читайте также в VK и Max

Можно, а зачем?

Инструменты дебага LLM-приложений на JS

Антон Непша на HolyJS 2026 рассказал про инструменты для отладки приложений с большими языковыми моделями на JavaScript. Доклад — чистая практика для тех, кто строит чат-боты или агентов.

Он показал, как console.log и node inspect быстро исчерпываются. Вместо этого — LangGraph Studio, LangSmith, LangFuse, Arize Phoenix и Lunary. Каждый инструмент даёт трейсы вызовов моделей, время, токены, манипуляцию состоянием на паузе.

Разбор плюсов и минусов: что удобно для локалки, что для продакшена, как обойти платные ключи и софхостинг. Сравнение с Sentry, OpenTelemetry, трюки вроде косинусного сходства для роутинга и мониторинга дрифта моделей.

#доклад

@tproger_web
Читайте также в VK и Max

Курс по основам компьютерных сетей

Хотите разобрать компьютерные сети от физического уровня до DNS с нуля, как на экзамене с бумагой и ручкой? freeCodeCamp выложил бесплатный курс "Computer Networking Fundamentals" от Kshitij Sharma — 12+ часов глубокого погружения в стек сетей.

Смотрим по ссылке: https://www.youtube.com/watch?v=fQbBPa0ADvs

@prog_point (теперь и в Max)

Запросы на сервер. Fetch, XMLHttpRequest (XHR), Ajax

Умение работать с запросами — один из главных навыков разработчика, потому что запросы отправляются и принимаются постоянно различными частями приложений. Здесь вы в простой форме сможете разобраться в том, как работают запросы, какие варианты существуют и как их применять.

#javascript #видео

Делаем браузер снова браузером

JustTheBrowser.com — проект, который чистит популярные браузеры (Chrome, Edge, Firefox) от навязчивых дополнений: убирает ИИ-функции вроде Copilot, телеметрию, спонсорский контент, напоминания о дефолтном браузере и прочий мусор. Всё через официальные политики групп — без модов исполняемых файлов.

Устанавливается всего одним скриптом для Windows/Mac/Linux, или вручную по гайдам. Если бесит реклама, AI-помощники и сбор данных — мастхэв.

@tproger_web
Читайте также в VK и Max

Давно в VS Code встроенный код ревьюер появился?

@tproger_web
Читайте также в VK и Max

Что умеет новый псевдокласс :near(), который может появиться в браузерах

В CSS может появиться псевдокласс :near() — он реагирует на расстояние курсора или сенсорного ввода до элемента, измеряя его в реальных единицах вроде пикселей или сантиметров. Это откроет двери для динамических интерфейсов: например, подсвечивать кнопки при приближении мыши, показывать всплывающие подсказки до клика или заранее прогружать изображения в галерее, когда пользователь просто ведёт курсором рядом.

В отличие от :hover, который срабатывает только при прямом наведении, :near(10px) позволит задавать радиус чувствительности. Это также пригодится для touch-устройств пользователей с толстыми пальцами или VR/AR, где точность ввода плавает. Элемент уже тестируется в Chrome Canary, с полифиллами для экспериментов.

Подробный разбор с примерами кода — в статье на CSS-Tricks.

@tproger_web
Читайте также в VK и Max

Внезапное порно в Conda

История такая: один разработчик хотел посмотреть YouTube, открыл меню «Пуск» в винде, начал вбивать You и увидел подсказу YouPorn. Очень удивился, потому что он не смотрит порно (конечно, а как вы подумали).

Начал расследование. Оказалось, что файл с таким именем лежит в

Anaconda3\pkgs\protego\info\test\tests\test_data

Protego — Python-библиотека для парсинга файлов robots.txt. В её тестовых данных есть пример файла robots.txt с сайта YouPorn т.е. обычный тест на реальных данных из интернета. Никакого вредоносного кода, никакой атаки на supply chain, просто Windows Search проиндексировал содержимое тестовых файлов внутри пакетов Conda.

Это хороший повод напомнить: Windows Search индексирует всё подряд, включая содержимое директорий с пакетами. При разработке на винде лучше добавить такие диры в исключения. Или не разрабатывать на винде.

@zen_of_python

Как бы выглядел интернет, если бы Adobe не убила Flash

Вспомните нулевые — браузерные страницы мигали баннерами и интерактивными элементами, игры запускались прямо во вкладке, а Flash Player был знаком почти всем. Но в 2020 году Adobe завершила его поддержку и начала блокировать Flash-контент. Так и закончилась эта история. А что было бы, если всё пошло иначе? Историю Flash и альтернативный сценарий разобрали в статье.

#историяit

@tproger_web
Читайте также в VK и Max

Playwright и Allure как хорошая практика для разработки веб-приложения

Разработчики вынуждены вечно искать баланс: как выпускать фичи быстро, качественно и желательно небольшой командой. Один из рабочих рецептов — это фронт + E2E-тесты.

E2E-тесты проверяют, как весь стек приложения работает вместе в реальной среде. Они имитируют действия конечного пользователя: нажатие кнопок, заполнение форм, навигацию по страницам и проверку содержимого.

Playwright предоставляет API для автоматизации действий в браузере. Он предлагает удобный способ создания и запуска E2E-тестов, благодаря поддержке браузеров Chromium, Firefox и WebKit, а также поддержке нескольких языков программирования: JavaScript, TypeScript, Python и других.

В статье автор рассказывает, как пользоваться этими инструментами и как прогонять порядка 1000 автотестов в сутки, имея всего 2 тестировщика вместо 15: https://habr.com/ru/companies/clevertec/articles/822583/

#react

@tproger_web
Читайте также в VK и Max

Новые реактивные формы в Angular: Signal Forms API

В 21 релизе Angular команда разработчиков представила экспериментальное API для построения реактивных форм с помощью сигналов. Тому, кто знаком с классическими Reactive Forms в Angular, новый Signal Forms API покажется эволюционным шагом: те же мощные возможности, но с сигналами — а значит, с автоматической реактивностью, полной типизацией и меньшим количеством шаблонного кода.

В статье вы узнаете, как с помощью сигналов теперь можно быстро создать типобезопасную форму, настроить валидацию с условными правилами, гибко управлять состояниями полей и легко встраивать кастомные компоненты-контролы.

#angular

@tproger_web
Читайте также в VK и Max

Разыскивая виновника, главное — не выйти на самого себя

@tproger_web
Читайте также в VK и Max