Обновить
128K+

JavaScript *

Прототипно-ориентированный язык программирования

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

Web‑карты: от координат до изображения

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

Статья посвящена базовым принципам работы тайловых веб‑карт. В ней рассматривается, как карта мира разбивается на небольшие изображения — тайлы, как устроен их URL и что означают параметры zoom, x и y.

На простых примерах разбирается связь между географическими координатами и положением тайла в общей сетке. Пошагово выводятся формулы преобразования долготы в координату X и широты в координату Y с учётом проекции Web Mercator.

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

Делаем ядро тайловой веб-карты на JS

Бесшовный переезд с Perl на Nuxt: история одного 20-летнего монолита

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

Привет, Хабр! Меня зовут Эрнест Гилязов, я тимлид группы разработки интерфейсов Рунити. В этой статье расскажу, как мы переносим на новый стек проект Рег.ру, кодовой базе которого исполняется 20 лет, и почему в итоге Nuxt-приложение само раздает шапку и футер в легаси-монолит через обычный JSON-эндпоинт.

Читать далее

Реалтайм на WebSocket со сквозной типизацией: TypeScript, Bun, React, Point0

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

Бывает так: есть фулстек проект, и в нём всё хорошо. Откуда-то есть сквозные типы (tRPC, генерация из OpenAPI), есть авторизация, есть основной функционал. А потом вы решаете добавить реалтайм: уведомление о новом посте в ленте, чат между пользователями, интерактивную доску. И появляется целый новый слой абстракций, в котором надо заново изобрести всё, что в проекте уже есть, только на новый лад. И дальше поддерживать две разные системы.

В своём фреймворке Point0 я добавил четыре новых реалтайм-поинта (структурные единицы наравне со страницами, лэйаутами, квери, мутациями): канал, спейс, клиентский хэндлер, серверный хэндлер. На них собирается практически любая реалтайм-функциональность, кода получается мало, и читается он интуитивно. Эти поинты несут те же свойства, что и все остальные:

код сервера и клиента живут в одном файле, компилятор вырезает клиентский код из серверной сборки, а серверный из клиентской

типизация сквозная и выводится из дженериков самого фреймворка, без генерации типов

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

Читать далее

SOP & CORS

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

Держите открытыми две вкладки. В одной — интернет-банк, куда вы залогинены и где на экране висит ваш баланс. В другой — какой-то сайт, на который вы забрели по ссылке из выдачи, ничего особенного. Теперь вопрос, который на первый взгляд кажется надуманным, а на деле упирается в фундамент всей веб-безопасности: что мешает скрипту со второго сайта взять и прочитать ваш баланс из первого?

Читать далее

Как я собрал браузерный хоррор на Three.js: GLB-контракт, аномалии и PS1-рендеринг для слабых устройств

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

Как я сделал браузерную 3D-игру на Three.js и Vue: система аномалий, GLB-сцена, PS1-рендеринг и оптимизация под слабые устройства.

Читать далее

Как не начать кодить слишком рано?

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

Часто разработка начинается с кода. Есть идея - мы открываем IDE, создаём проект и начинаем писать. Не задумываясь о том, что в этот момент мы ещё можем не понимать, какую проблему решаем и что вообще должна делать система.

В этой статье разберём путь от пользовательской потребности до реализации: UCD → FR/NFR → KISS → компонентная разработка → код.

Читать далее

Автоматизированное тестирование Webauthn с помощью Playwright

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

Авторизация — это сложно… Хотя казалось бы — самая частая используемая фича в мире. Очень многие процесы завязаны на авторизации и аунтентификации. Начиная от ваших любимых соц сетей и заканчивая редакторами кода.

Читать далее

История одного архитектурного круга: реактивность Vue

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

Vue снова меняет способ обновления интерфейса: теперь на горизонте Vapor и рендеринг без Virtual DOM. Зачем очередная архитектурная перестройка и что не устраивает команду Vue в нынешнем подходе?

Чтобы ответить, проследим путь Vue от Object.defineProperty до Proxy  и зачем теперь понадобился Vapor. Это поможет лучше понимать поведение ref, reactive и computed, вникнуть в причины архитектурных изменений Vue и подготовиться к дальнейшим изменениям.

Читать далее

Agent Skills в npm-пакетах: доставка агенту знаний о библиотеке

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

Чтобы разобраться с незнакомой библиотекой, ИИ-агент читает установленный пакет: исходный код, типы, README, примеры и тесты. Эти источники точны, но перегружены деталями реализации. Назначение компонентов, публичные границы, порядок подключения и обязательные проверки агенту приходится восстанавливать самостоятельно, расходуя время и контекст модели.

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

Если включить навык в npm-пакет, менеджер пакетов доставит инструкции вместе с кодом, lock-файл закрепит их версию, а проект сам решит, делать ли навык доступным агенту.

Читать далее

Размытая граница между состояниями CSS и событиями JavaScript

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

CSS «слушает» нас. Нет, не в буквальном смысле. Суть в том, что в CSS появляется все больше псевдоклассов, которые позволяют реагировать на события JS без необходимости писать сам JS. Формально псевдоклассы отслеживают состояния, а не события, но порой они настолько похожи на обработчики событий, что разница становится почти незаметной (хотя в контексте CSS это не так уж важно).

Читать далее

Kotlin? Swift? Flutter? Нет, кириллица: пишем production-приложение с картой и push-ами на 1С: Элемент

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

Привет, Хабр! (И тебе, 1С-ник, который открыл статью только чтобы убедиться, что пока точно не надо изучать новый продукт. И тебе, питонист, который сейчас будет морщиться. И тебе, мобильный разработчик, который уверен, что без Kotlin/Swift нормальное приложение не родится - держи кружку крепче.)

Эта статья будет посвящена технологии, на которой можно написать своё мобильное приложение за пару дней. И я вам на примере реализованного мною полноценного проекта логистического приложения покажу, что сейчас из себя представляет эта технология на нашей родной КИРИЛЛИЦЕ, и что на ней можно сделать прямо сейчас. И самое главное, как…

Читать далее

Вторая копия Vue: как лишняя строка в lockfile повесила Chromium

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

Может ли лишняя запись в yarn.lock повесить браузер? Наша прожила в репозитории три месяца, не привлекая внимания, а потом ночью после релиза положила прод вечным лоадером - причём только в Chromium. Рассказываю, как мы шли к разгадке через ложные следы и что в итоге оказалось в рантайме.

Читать далее

ИИ Агент для скоринга торговых рекомендаций

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

👾 ИИ Агент для скоринга торговых рекомендаций

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

В итоге оценивается не красивая лента и не заявленный win rate, а статистически проверяемое качество решений автора.

Читать далее

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

Отдали базу штрихкодов статикой: 1,9 МБ, 1387 шардов, медиана в одну строку

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

Браузерный сканер штрихкодов упирается в развилку: чтобы показать, что за товар в руках, надо сходить в товарный API — и отдать туда номер, IP и время. По одному запросу это ничего, по потоку — фактический чек, собранный чужими руками.

Второй путь: скачать базу один раз, порезать на файлы по префиксу и раздавать статикой. Разбираем, что из этого вышло на 32 772 товарах: 1387 шардов, 1,85 МиБ сырых и 429 КиБ в brotli, худший файл 331 КиБ. И главное — сколько приватности при этом всё равно утекает: запрос к серверу есть, а медиана строк в шарде равна единице, то есть для 722 файлов из 1387 запрос за шардом равен запросу за товаром.

Внутри: фильтр на входе, почему не одним файлом, TSV против JSON с замерами, и что в схеме до сих пор не решено.

Читать далее

«Почему мы снова говорим про архитектуру?»

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

Разработчик интерфейсов уверен, что выбранный им фреймворк автоматически решает за него вопросы структуры и организации кода. Он искренне верит, что если взять React, Angular, Vue, да тысячи их, то получает в руки серебряную пулю, которая закроет все проблемы разработки. Достаточно следовать документации фреймворка, и с проектом все будет хорошо в долгосрочной перспективе. И я сам долгое время рассуждал точно так же, я воспринимал только Angular, потому что там есть хоть какой-то структурный подход. На практике это оказывается большим заблуждением.

Что делать и кто виноват?

Три разных номера из одной книги — и все проходят контрольную цифру

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

У EAN-13 есть контрольная цифра, и из этого обычно делают вывод: раз проверка сошлась, номер прочитан верно. Вывод неверный. Я получил с одной книги три разных номера, и все три контрольную цифру проходят. Разбираю, почему так выходит, почему у QR такой беды нет и что с этим делать — с кодом, замерами и таблицей, откуда взялась каждая цифра.

Читать далее

Блокчейн глазами разработчика: append‑only база данных, за запись в которую платят

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

Слово «блокчейн» испорчено маркетингом. За десять лет вокруг него наросло столько «революций», «иксов» и «цифрового золота», что нормальный разработчик при его звуке закрывает вкладку — и я его понимаю.

Проблема в том, что за хайпом прячется инженерно интересная конструкция. Если убрать из блокчейна всё маркетинговое и посмотреть на него глазами человека, который каждый день работает с Postgres, Kafka и git, останется знакомая до боли вещь: реплицированный append‑only лог, в котором состояние — это проекция, а запись — платная.

В этой статье я разберу блокчейн именно так: без «крипты», через аналогии с инструментами, которыми вы пользуетесь каждый день. А в конце мы подключимся к реальной сети из десяти строк TypeScript и пощупаем этот лог руками.

Читать далее

Обновления GigaIDE за июль 2026

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

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

Читать далее

Я написал мессенджер в одиночку … Разбор 149-ФЗ

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

Омаж на статью https://habr.com/ru/articles/1066668/ от @BorisXQ

Я тоже написал "мессенджер" на любимом $mol ( благодаря которому я могу добавить этот мессенджер в любое своё $mol приложение за 1 строчку кода ) и GiperBaza, без слежки, логина, пароля, и вообще без сбора каких либо данных

И даже почти без сервера)

P.S Только для домашнего использования

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

Вступайте в очередной реестр всех айтишников!) https://b-on-g.github.io/gram/#!users=xa77SU2P_FSMnTiSP

Или написать мне напрямую https://b-on-g.github.io/gram/#!invite=J2kVT1UX_fmQm09dd

Читать далее

Как мигрировать 1 млн строк кода с одного языка на другой за 2 недели

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

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

За последний месяц отдельные разработчики Anthropic с помощью Claude Fable 5, Claude Opus 4.8 и dynamic workflows перенесли десять проектов объемом от десятков до сотен тысяч строк кода. В этой статье мы разберем два примера и лучшие практики, сформировавшиеся в ходе этих проектов.

Джарред Самнер, сооснователь Bun и технический специалист Anthropic, использовал Claude Code, чтобы перенести Bun с Zig на Rust. Менее чем за две недели было создано миллион строк кода. До слияния ветки 100% существующих тестов Bun проходили в CI. После слияния обнаружилось 19 регрессий, все они уже исправлены. В июне версия на Rust вошла в состав Claude Code.

Майк Кригер, один из руководителей Anthropic Labs, за выходные перенес кодовую базу на Python в 165 000 строк TypeScript. В процессе работали сотни агентов, использовались восемь контрольных этапов, три раунда состязательного ревью и финальная проверка, которая сравнивала вывод каждой команды с результатом оригинальной версии на Python.

Новые возможности Claude Code меняют экономику давно откладываемых проектов. Ниже описан процесс из шести шагов, который мы теперь используем, он основан на выводах из этих миграций.

Читать далее