Уже почти июнь подходит к концу, а я так и не выпустил эту статью. Исправляюсь.
Обзор на браузерные API, которые стали Widely available в мае 2026. Раз в месяц я буду вам напоминать, что вы уже можете использовать в проде.
Каждый месяц выходят новые CSS-свойства, HTML-атрибуты, JavaScript-методы и WebAPI, но применять в проде мы их конечно же не будем. 2.5 года назад также каждый месяц выходили новые фичи в браузере, а вот их уже пора начинать применять.
Искусственный интеллект стремительно эволюционирует: от простого генерирования текста нейросети переходят к полноценному веб-серфингу, активному взаимодействию с интерфейсами и выполнению сложных задач на ваших сайтах. В этих реалиях разработчикам необходимы специализированные инструменты, способные обеспечить высокий уровень UX для таких «нечеловеческих» пользователей.
Новая категория Agentic browsing в Lighthouse вместе с улучшениями в Chrome DevTools предоставляют детерминированные аудиты и среду тестирования, которые помогут вам создавать сайты, полностью готовые к работе с AI-агентами.
Друзья, сегодня отличный день, чтобы сделать свою первую статью на Хабре, который я читаю многие годы. Сегодня я успешно запустил в прод свой первый полноценный хобби (пет) проект.
Два года назад работая с замечательной командой консультантов института Адизеса, мы столкнулись с проблемой наличия бесплатного гибкого софта для построения орг.моделей. Быстро собрать подразделения и функции, перетащить ветки в новое место, покрасить и так что бы не рисовать линии и квадратики, а только сосредоточиться на самой модели, потому что все это происходит во время страт. сессии, где сидят руководители тех самых подразделений. А подразделений и веток много, сценариев много – кого-то временно скрыть или свернуть, кого-то скопировать как типовую функцию в другие ветки. Все делать нужно быстро и на большом экране и не всегда в логике HR штатной модели (а точнее всегда не в ней). Миро, Фигма и прочие конструкторы не подходят по той или иной причине.
Так у меня родилась идея приложения ORGFORMAT. Но только спустя два года я нашел время, чтобы ее реализовать.
Но мало сделать приложение, не менее важным было сделать легкий обмен сформированными моделями, возможность их просмотра и доработки участниками. А еще лучше часть рутины по низшим ветвям отдать ИИ на проверку или доработку. Так родилась еще одна идея – создать формат моделей, который говорит и на языке программы (data-to-diagram), и на языке человека, и на языке ИИ, и не зашит никакими лицензиями и нечитаемым кодом. То есть открытый формат. Было важно, чтобы формат работал с иерархическими моделями и не позволял никакие кросс-связи буквально, что бы пользователи не творили хаос между ветвями. Только прямая естественная потоковая иерархия и прямая ответственность. Но и признаки блокам нужны, так как не все способна отразить иерархия - так пришла идея тегов, как гибкая система реквизитов (а во многом и, по сути, мини база данных, при необходимости. Лайфхак!). Так же очень хотелось, что бы модель не только строила связи, но и по ним могла что-то посчитать - конечно же нужна универсальная ценность (value), но не ограничивать ее только одним типом, а дать свободно выбирать, что считать и в каких единицах схмерения – бюджет, время, единицы товара или количество населения страны. И это тоже нам надо! Для всего это отлично подошел хорошо известный ИТ-ишникам формат YAML, который для людей открыт, как текст, а для машины, по сути, четкая структура данных. Вот и отлично, я собрал на его базе прототип структуры и необходимых атрибутов. И дал короткое название .orgf. Сгенерировал несколько моделей через ИИ и дал проверить результат другой ИИ – результат великолепный. ИИ легко переводила любые данные в этот формат, хоть штатное расписание из Екселя, хоть выгруженные в PDF структуры функций и процессов. Прототип открытого формата ORGF себя полностью оправдал! Так получилось, что модели и формат появились раньше самого редактора моделей (приложения). Ну что же есть понятный запрос, теперь надо было сделать под него софт!
Несколько лет назад в процессе подготовки очередной статьи (о ней чуть ниже) я вынужденно столкнулся с новым редактором Habr, которого до этого мне удавалось избегать, и который к тому моменту стал безальтернативным.
Тогда “по мотивам” пользования этим поделием почти сама родилась статья Несколько «добрых» слов о текущей версии редактора Habr, в которой я изложил всё, что я думал о новом редакторе (вернее ту часть мыслей, которую можно было напечатать, поскольку значительная их часть была непечатной)
Я будучи пессимистом тогда наивно полагал, что “хуже быть не может”, однако как оказалось ситуация тогда была оптимистическая, и “может быть еще хуже”
Привет, Хабр!
Как то я видел мучения электриков при расчётах — сам поискал несколько сайтов с калькуляторами половина не работает а другая непонятно откуда берут данные и да я вообще не электрик но суммируя всё это — решил сделать свой интрумент единный HTML файл — без регистрации — смс и тд — так на свет появился ElectroKit и выложил его на Хабр и текст писал с помощью ИИ за что справедливо был помечен как «Сгенерировано». Но инструмент получил 11 тысяч просмотров, 64 закладки и 22 комментария. И вот комментарии оказались интереснее всего, благодаря комментариям вышел в свет ElectroKit 2.0
В общем и целом это практически полностью ИИ порт на создание которого ушло всего 10 минут!Так я решил проверить готова ли самая обычная нейронка портировать с нуля игру в браузер, так сказать под ключ.
Инженеры узнают о межсайтовом скриптинге (Cross-Site Scripting, XSS) тремя способами.
Счастливчики узнают о нем благодаря полезному анализу кода или проактивному правилу проверки кода. Внимательные — во время аудита безопасности, который выявляет уязвимость до того, как она попадет в продакшн.
А есть те, кто узнает о нем через страдания, когда их сайт становится уязвимым. Когда злоумышленник внедряет скрипт, который крадет токены сессий из localStorage, перехватывает файлы cookie или перенаправляет пользователей на фишинговый сайт. Я лично присоединился к клубу «пострадавших» еще в 2005 году, когда встроенная Flash-подпись на форуме, которым я владел, превратилась в кошмар с точки зрения безопасности… но это уже другая история.
В этой статье мы рассмотрим, как браузер, наконец, снимает с нас бремя очистки данных (sanitizing) благодаря новому HTML API Sanitizer.
Что, если мы создадим такой интерфейс в 1С, чтобы он был удобнее, чем в Excel? Да не просто удобнее — а чтобы сотрудники сказали: «Ого, это же как игра!» С вами снова Ведущий специалист модуля разработки 1С Михеев Антон. Давайте вместе сделаем эту игру идею реальностью
Представьте, что Excel — это склад, вид сверху. Синие ячейки — стеллажи, в них лежат товары. Да, на множестве складов топология нарисована именно в Excel. Сотрудникам так понятнее и удобнее: закрашивать ячейки в таблице куда проще, чем разбираться, как заполнять справочники с кучей непонятных цифр в 1С.
Хабр, привет!
Многие фронтенд-разработчики часто отдают предпочтение JavaScript при реализации интерфейсных элементов. Я же разработчик старой формации. Мы тогда стремились сделать всё с помощью HTML и CSS.
Так в интернете зародилось множество HTML- и CSS-решений. Думаю, вы видели эти костыли с переключением радиокнопок и стилизацией других элементов. У меня был период, когда я тоже загонялся по ним.
Честно говоря, это всё баловство. Но с развитием HTML и CSS появились классные подходы, которые частично заменяют логику, написанную на JavaScript. И мне хочется, чтобы вы использовали их как можно чаще. Поэтому сегодня я поделюсь с вами несколькими техниками, которые вы уже можете использовать в своих проектах.
Давайте посмотрим, что я вам подготовил.
Как-то вечером я поймал себя на том, что трачу по 20 минут на поиск цветовой палитры для каждого нового проекта. Coolors, Adobe Color, случайные пины в Pinterest — и всё равно ощущение «не то». Тогда я задал себе вопрос: а что если вместо колеса оттенков начинать со слова? «Рассвет», «шторм», «лакшери» — у каждого слова есть интуитивный цвет.
Так появился Колорит — инструмент, который превращает слово или фотографию в цветовую палитру с помощью ИИ. В этой статье расскажу про технические решения, prompt engineering для DeepSeek и пару неочевидных браузерных API.
Мы рады объявить о релизе MDN MCP-сервера. MCP (Model Context Protocol) — это открытый стандарт, который позволяет ИИ-инструментам подключаться к внешним источникам данных. MDN MCP-сервер использует этот протокол, чтобы доставлять документацию MDN и данные о совместимости браузеров прямо в твой редактор кода или IDE.
Что будет, если взять один HTML-файл, браузер, localStorage и git-хостинг с CRUD API? Получится мессенджер. Без backend, базы данных, регистрации, npm и WebSocket. В статье показываю, как устроен Macaroni Messenger: хранение сообщений в .macaroni/, outbox, git-agnostic adapters, storage branch, plugin API и опциональное шифрование.
Замена одной кнопки не должна тянуть за собой весь React. В RWC — не тянет.
Каждый компонент RWC — самостоятельный Custom Element. Он не зависит от рантайма хоста и работает внутри React-дерева, Angular-приложения или чистого HTML.
Поэтому старый React-компонент и новая RWC-кнопка живут на одной странице одновременно.
На практике: UI-кит мигрируется покомпонентно, по одному виджету за спринт. Без feature-freeze, без второго рантайма фреймворка и параллельной сборки ради сосуществования версий.
Единица изоляции здесь — сам компонент, а не application runtime.
Привет, Хабр!
Меня зовут Дмитрий, руководитель отдела рекламы и продвижения в Аспро. Мы запускаем интернет-магазины и развиваем систему управления бизнесом Аспро.Cloud.
Пару месяцев назад у меня возник вопрос: как интернет-магазины применяют маркетинговые фишки и насколько используют потенциал наших решений? За основу мы взяли каталог с 1849 сайтами, которые запускали мы и наши партнеры.
Написали парсер, прогнали через него 852 отобранных интернет-магазина по 30 критериям, часть сайтов дополнительно проверили вручную по 100+ параметрам. Результат не удивил — но конкретные цифры все равно оказались показательными.
Хабр, привет!
Меня всегда раздражали вопросы на проверку знаний HTML и CSS. На моей памяти я ни разу не встретил человека, который спрашивал что-то интересное. По этой причине у меня появилось несколько статей с вопросами по CSS, которые собрали достаточно много просмотров для меня.
А что касается HTML, то я ничего не написал. Сегодня буду исправляться. Сразу скажу, что это не будут вопросы в стиле: «А какие HTML5-элементы вы знаете?». Мне хочется, чтобы вам было интересно и чтобы вы узнали что-то новое.
По этой причине большинство вопросов связаны с практикой. И абсолютно точно вы не ответите на все. Хотя, может, я ошибаюсь. Вот и проверим, насколько я прав.
Давайте посмотрим, что я вам подготовил.
Меня зовут Денис, я бизнес-аналитик. Статья про то, как я построил себе рабочий инструмент — Custom Tool — который живёт прямо в браузере, ничего не требует устанавливать и помогает не забыть ни одного важного вопроса при разборе задачи.
Ссылка на инструмент: denissadykov.github.io/ba-cheatsheet/custom
Всё открыто, бесплатно, без регистрации.
Webnative - фреймворк для разработки нативных приложений на языках веба с использованием нативных webview компонентов.
В мире — миллионы заражений сифилисом и ВИЧ, и цифра растёт. Но мой пост не об этом.
Я решил техническую задачу: как сделать медицинский образовательный инструмент, который работает офлайн, не требует бэкенда и не собирает данные пользователей, используя веб‑технологии JS. Ведь в медицине приватность — это требование.
Код открыт, лендинг и игры доступны по ссылке.
Как мы превратили панель управления NAS в платформу для расширений, зачем туда Log Manager и для чего Plugin Template.
В новой версии 3.6.4 я добавил возможность устанавливать плагины. Перед реализацией возникло много вопросов. Наша ключевая фишка — мультисеть (позволяет переключать фронтенд на бэкенд другого сервера для его мониторинга и управления). Значит, и модуль плагинов должен уметь переключаться.
И......
