Обновить
425.25

Веб-разработка *

Делаем веб лучше

Сначала показывать
Порог рейтинга
Уровень сложности

Хватит использовать JavaScript для решения задач CSS

Уровень сложностиПростой
Время на прочтение10 мин
Охват и читатели12K

Недостаток знаний часто подталкивает людей к чрезмерно сложным решениям, и рано или поздно это отражается на производительности.

Возьмем content-visibility: auto. Он дает тот же эффект, что и React-Window, но без единой строчки JS и без увеличения размера сборки. Аналогичная ситуация с современными единицами высоты окна (dvh, svh, lvh): наконец-то приведена в порядок "мобильная" высота, которую годами пытались компенсировать через window.innerHeight.

Обе технологии в 2024 году получили более 90% поддержки современных браузеров и полностью готовы для продакшна. Однако мы по привычке продолжаем решать такие задачи с помощью JS, просто потому, что CSS незаметно ушел вперед, пока мы спорили о React Server Components.

Читать далее

Идеальных систем не существует. Монолит, микросервисы и цена распределённости. CAP, ACID, BASE

Уровень сложностиСредний
Время на прочтение13 мин
Охват и читатели6.6K

Эта статья не про «правильную» архитектуру. Здесь я постарался ответить на вопросы «почему микросервисы дороже, какие компромиссы неизбежны и по каким критериям выбирать архитектуру?»

Поговорим про высоконагруженные распределённые системы и почему монолиты — это не плохо. Также поговорим о необходимости рационального использования ресурсов и выборе типа архитектуры.

Погрузиться

Результаты исследования: требования к джуниор фронтенд-разработчикам

Уровень сложностиПростой
Время на прочтение12 мин
Охват и читатели5.9K

В Яндекс Практикуме мы постоянно следим за изменениями на рынке и обновляем учебные программы в соответствии с новыми требованиями. Чтобы актуализировать курс «Фронтенд-разработчик», в конце 2025 мы опросили нанимающих менеджеров из Сбера, «МегаФона», VK, «Северстали» и компаний среднего и малого бизнеса. 

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

Читать далее

[Laravel-Telegram] Пример сервиса на Laravel для авторизации пользователя через Telegram в mini-app

Уровень сложностиСредний
Время на прочтение8 мин
Охват и читатели6.5K

Авторизация пользователя в Telegram mini-app сейчас как никогда важна. Но что если вам необходимо сделать это в вашей сервисной/микросервисной архитектуре с отправкой смс-кода?

Читать далее

Тихая смерть robots.txt

Уровень сложностиПростой
Время на прочтение11 мин
Охват и читатели37K

Десятки лет robots.txt управлял поведением веб-краулеров. Но сегодня, когда беспринципные ИИ-компании стремятся к получению всё больших объёмов данных, базовый общественный договор веба начинает разваливаться на части.

В течение трёх десятков лет крошечный текстовый файл удерживал Интернет от падения в хаос. Этот файл не имел никакого конкретного юридического или технического веса, и даже был не особо сложным. Он представляет собой скреплённый рукопожатием договор между первопроходцами Интернета о том, что они уважают пожелания друг друга и строят Интернет так, чтобы от этого выигрывали все. Это мини-конституция Интернета, записанная в коде.

Файл называется robots.txt; обычно он находится по адресу вашвебсайт.com/robots.txt. Этот файл позволяет любому, кто владеет сайтом, будь то мелкий кулинарный блог или многонациональная корпорация, сообщить вебу, что на нём разрешено, а что нет. Какие поисковые движки могут индексировать ваш сайт? Какие архивные проекты могут скачивать и сохранять версии страницы? Могут ли конкуренты отслеживать ваши страницы? Вы сами решаете и объявляете об этом вебу.

Эта система неидеальна, но она работает. Ну, или, по крайней мере, работала. Десятки лет основной целью robots.txt были поисковые движки; владелец позволял выполнять скрейпинг, а в ответ они обещали привести на сайт пользователей. Сегодня это уравнение изменилось из-за ИИ: компании всего мира используют сайты и их данные для коллекционирования огромных датасетов обучающих данных, чтобы создавать модели и продукты, которые могут вообще не признавать существование первоисточников.

Файл robots.txt работает по принципу «ты — мне, я — тебе», но у очень многих людей сложилось впечатление, что ИИ-компании любят только брать. Cегодня в ИИ вбухано так много денег, а технологический прогресс идёт вперёд так быстро, что многие владельцы сайтов за ним не поспевают. И фундаментальный договор, лежащий в основе robots.txt и веба в целом, возможно, тоже утрачивает свою силу.

Читать далее

Геймдев в браузере: опыт разработки игр на JavaScript

Уровень сложностиПростой
Время на прочтение7 мин
Охват и читатели7.5K

Привет! Меня зовут Максим и я frontend-разработчик в компании SimbirSoft. Думаю, из названия статьи вы уже поняли, что я не только занимаюсь разработкой интерфейсов, но и увлекаюсь созданием игр. Интерес к геймдеву появился у меня ещё в университете, когда я решил познакомиться с Unity. Тогда я не планировал строить карьеру разработчика игр, но сам процесс затянул. Даже став полноценным специалистом в своей области, я не перестал думать о геймдеве. Поэтому решил совместить приятное с полезным, а именно: изучить экосистему языка JavaScript на наличие инструментов для геймдева. Результатом стали три игры, опубликованные на платформе Яндекс Игры. Изучив и опробовав несколько технологий, я понял, что создавать игры на JavaScript вполне реально. 

Читать далее ⚡

Metaflow: повышение эффективности ML/AI-разработки в Netflix

Уровень сложностиСредний
Время на прочтение11 мин
Охват и читатели7.7K

Metaflow — это фреймворк, работу над которым мы начали в 2019. В том же году мы открыли его исходный код. Теперь он обеспечивает функционирование широкого спектра ML/AI-систем в Netflix, а так же — во многих других компаниях. Он пользуется любовью тех, кто его применяет, так как он помогает им доводить их ML/AI-идеи от стадии прототипа до продакшна. Он позволяет им уделять внимание не решению рутинных задач, а созданию современнейших систем, которые дарят радость людям по всему миру и развлекают их.

Metaflow даёт разработчикам следующие возможности:

Читать далее

Как я сделал виджет видеозвонков для сайтов с транскрипцией речи в реальном времени

Уровень сложностиПростой
Время на прочтение8 мин
Охват и читатели6.9K

Я давно увлекаюсь и изучаю технологии WebRTC. Устанавливал для клиентов множество WebRTC медиа серверов и кастомизировал их. Но постоянно не хватало гибкости. В итоге обнаружил чистую реализацию WebRTC на Golang, которая умеет и MESH, и SFU. Сейчас буду рассказывать, что удалось разработать и в чем польза.

Читать далее

Алгоритм резолва зависимостей в Angular Ivy: Математика Блум-фильтров и битовые маски

Уровень сложностиСложный
Время на прочтение5 мин
Охват и читатели10K

Как Angular Ivy находит зависимости за O(1)? Глубокое погружение в алгоритм резолва: от генерации уникальных ID токенов до битовой магии Блум-фильтров. Разбираем, почему строковые токены замедляют ваше приложение и как работает наследование кумулятивных масок в LView.

Разложить на биты

Как создать ИИ-консультанта для сайта интернет-магазина и поднять конверсию

Уровень сложностиПростой
Время на прочтение9 мин
Охват и читатели7.9K

Уже больше 10 лет я занимаюсь продвижением SaaS и IT-сервисов. За это время мы вывели в лидеры своих ниш не один продукт. И все это время у меня было желание сделать собственный сервис, и заниматься его развитием. И сейчас, в эпоху нейросетей, это время пришло - я открываю новое направление продуктовой разработки. Часть продуктов уже работает для наших внутренних процессов, часть находится в активной разработке. Будут, как сервисы по подписной SaaS-модели, так и заказная разработка: от классических сайтов и интернет-магазинов до сложных приложений с AI-автоматизацией.

И сегодня расскажу об одном из наших первых опытов разработки AI-продукта, как мы прошли путь от простого бота до полноценного AI-продавца-консультанта с RAG (векторной базой знаний) для интернет-магазина на WordPress c WooCommerce, обслуживание которого почти ничего не стоит, а пользы, как от целого отдела продаж или поддержки.

Читать далее

Как мы сократили объем данных в 10 раз, не повредив пользовательскому опыту, или переезд Postgres → ClickHouse

Уровень сложностиСредний
Время на прочтение13 мин
Охват и читатели16K

Всем привет, меня зовут Алексей Леонтьев, я техлид и архитектор на проекте Smartbot в компании KTS. Smartbot — это nocode-платформа для настройки сценариев чат-ботов, которые могут работать в нескольких соцсетях и мессенджерах одновременно.

Мы храним много данных о событиях, которые обрабатывает наша платформа. Раньше для этого мы использовали Postgres. Но возникла задача сократить потребляемые кластером ресурсы.

В этой статье я расскажу о том, как мы бесшовно перенесли данные из Postgres в ClickHouse. И при этом сократили оперативную память в 4 раза, а размер потребляемого дискового пространства — на порядок.

Читать далее

От пустоты к идее: как я создал свою первую доску вдохновения

Уровень сложностиПростой
Время на прочтение27 мин
Охват и читатели11K

Эта история не о строчках кода, а о том, как мы с другом устали смотреть на пустую доску в офисе. Сначала мы сделали свою версию проекта — с партнёрами и погодой, как мы предполагали по возможным требованиям. Потом я создал версию для себя: с котиками из Giphy API, бегущей строкой цитат и анимированной погодой. В этой статье — о том, как из простого желания добавить красок в рабочее пространство родился личный Preloader перед началом работы, и как пустота корпоративного экрана превратилась в доску вдохновения, которая теперь висит фоном на моём мониторе.

Читать далее

Методы массивов. Часть 2

Уровень сложностиПростой
Время на прочтение8 мин
Охват и читатели11K

Привет, Хабр! Меня зовут Александр Дудукало, я автор курса по JavaScript. Сегодня мы поговорим о ключевом навыке разработчика. С помощью чего сделать код лаконичнее и выразительнее, при этом заменяя громоздкие циклы простыми конструкциями?

Владение методами массивов — это и есть тот самый ответ. Это база, которая позволяет писать код, понятный человеку, а не только машине, и умение переключиться с вопроса «как сделать» на результат «что получить».

Мы разберем три самых полезных метода: map — для преобразования данных, filter — для отбора элементов и sort — для сортировки. Вы поймете, как они работают внутри, и примените знания на практике, создав свои аналоги этих функций. Подробности, как всегда, внутри.

Читать далее

Ближайшие события

Организация middleware в Go без зависимостей

Время на прочтение5 мин
Охват и читатели7.9K

Go 1.22 заметно укрепил позиции стандартной библиотеки в роли «достаточно хорошего» веб‑стека: ServeMux научился матчить шаблоны, и зависимость от роутеров ради базовой маршрутизации уже не выглядит обязательной. Но как только в проекте появляется больше пары middleware, начинается знакомая боль — обёртки размножаются, порядок теряется, правки становятся хрупкими.

В этой статье разбираем, как собрать управляемые цепочки middleware без alice и как поверх http.ServeMux сделать группировку маршрутов с наследованием middleware в стиле chi — только на стандартной библиотеке и с минимальным количеством кода.

Смотреть решение

nebo.css — впуклые углы проще простого

Уровень сложностиПростой
Время на прочтение4 мин
Охват и читатели24K

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

«Инвертированный», «вогнутый», «впуклый» угол, а также negative border radius или inverted border radius. Когда слышите это — знайте, дальше будут страдания.

Проблема в том, что приём выглядит просто, но нативного способа сделать такой угол в CSS нет. Поэтому в ход идут тучи дополнительных обёрток и море стилей для их позиционирования. И всё это ломается на неоднородном фоне.

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

Читать далее

Интерактивный SQL в браузере: как я создал встраиваемую песочницу с поддержкой 20+ СУБД

Уровень сложностиПростой
Время на прочтение4 мин
Охват и читатели7.8K

В статье разбирается техническая реализация SQLize Embed — легковесного JS-компонента для создания интерактивных песочниц прямо в тексте технических статей. Автор подробно описывает архитектуру решения: от использования MutationObserver для инициализации редакторов на фронтенде до обеспечения безопасности и изоляции запросов в Docker-контейнерах на бэкенде.

Вы узнаете, как реализована поддержка более 20 СУБД (включая PostgreSQL 18, MS SQL 2025 и Oracle 23ai) и как встроить «живые» примеры кода в свой проект всего парой строк HTML.

Читать далее

Технический долг vs сроки: баланс при разработке госреестра

Уровень сложностиСредний
Время на прочтение6 мин
Охват и читатели6.7K

Привет, я Андрей! Ну где ты был, ну открывай статью скорей :)

За технической инфой я обращался к команде разработчиков, в том числе к backend-разработчику Сергею Колеватову. Он пояснил мне за все технические штуки, а я уже поведаю вам подробнее.

В этот раз расскажу об опыте создания внутренней системы для госкомпании. Загвоздка, как всегда, была в сроках и ресурсах. А продукт нужен сразу порядочный. Готовый шаблон, Symfony Forms и «грязный» код. Выбор пал на скорость вместо качества — продукт запущен за 2 месяца, ноооо… мы получили «технический долг». Как к этому пришли и как решили проблему, расскажу прямо сейчас.

Читать далее

Разработчики всё ещё путают JWT, JWKS, OAuth2 и OpenID Connect — разбираем на примерах. Часть 2

Уровень сложностиСредний
Время на прочтение42 мин
Охват и читатели15K

Мы продолжаем наше погружение в мир аутентификации и будем разбирать всё на простых примерах с практикой на Go.

В первой части статьи мы разобрали, как устроен JWT, зачем нам refresh и access токены и почему в распределенных системах нам необходимо использовать асимметричные алгоритмы подписи. 

Теперь пришло время двигаться дальше и познакомиться с тем, что стоит поверх JWT: JWKS, OAuth 2.0, OIDC.

Читать далее

WordPress Cookie предупреждение без плагина

Уровень сложностиПростой
Время на прочтение3 мин
Охват и читатели5.8K

WordPress Cookie предупреждение без плагина – это то, что вам нужно, чтобы соблюдать закон и не замедлять работу вашего сайта. Лично я пришёл к этому не сразу и использовал плагин, но потом работал над ускорением сайта по PageSpeed Insights и отказался от плагина.

Читать далее

Поиск для интернет-магазина: 24 обязательных элемента, которые помогут покупателям найти нужное и увеличат конверсию

Время на прочтение13 мин
Охват и читатели8.6K

Всем привет! Меня зовут Саша, и последние 12 лет моя жизнь — это дизайн. Сегодня я руковожу дизайн-командой в KISLOROD, а в прошлом — помогал крупным брендам и миллионным сервисам обрести их уникальный голос и форму.

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

В этой статье перечислим основные элементы, которые позволяют нам повышать качество поиска в клиентских проектах.

Читать далее