Datasette Apps: HTML-приложения внутри инструмента для публикации SQLite

Datasette — это опенсорсный инструмент, который выставляет SQLite-базы как веб-интерфейс: таблицы, SQL-запросы, JSON API и плагины. Для веб-разработчика это способ быстро дать данным лицо или собрать внутреннюю админку без полноценного бэкенда.

Теперь в нём появился плагин datasette-apps: HTML+JS-приложения, которые живут внутри Datasette и читают SQL прямо из браузера. Песочница жёсткая — iframe без cookies и localStorage, плюс CSP блокирует внешние запросы. Как пишет Саймон Уиллисон, даже если приложение сломают, приватные данные не уйдут со страницы. Запись возможна только через заранее сохранённые SQL-запросы.

Я бы сохранил для прототипов и внутренних админок: вместо связки бэкенд+фронтенд получается самодостаточный блок, который сразу работает с SQLite. Потрогать можно на agent.datasette.io.

Авторитетный и рекурсивный DNS: зачем фронтендеру это знать

Если вы меняли хостинг или прикручивали CDN, то видели, как новые записи встают не сразу — кто-то уже попадает на новый сервер, а кто-то ещё стучится в старый. Виноват не фреймворк, а разница между двумя ролями DNS.

Авторитетный сервер считается источником правды для вашего домена: именно он отвечает за его DNS-записи. Рекурсивный резолвер выступает посредником: ходит от корня к TLD, затем к авторитетному серверу и кеширует ответ на своей стороне. Именно кеш резолверов, а не «где-то там в интернете», создаёт задержку при propagation.

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

Почему async без await — плохая привычка

Кажется, что добавить async к функции «на всякий случай» безопасно. На деле вы меняете правила работы функции: она начинает возвращать не готовое значение, а Promise. Теперь каждый, кто её вызывает, обязан писать await, а значит, и его вызывающие тоже становятся async-функциями.

Так «асинхронность» расползается по коду заразно: вдруг половина проекта завёрнута в Promise, хотя реальной работы с сетью или файлами там нет. Читать такой код сложнее — непонятно, где настоящее ожидание ответа от сервера, а где просто возврат готовой переменной.

Правило проще, чем кажется: если внутри функции нет await, не пишите перед ней async. Добавите потом за минуту, когда это реально понадобится. Разбор Мэтта Смита поможет почувствовать разницу.

Почему код иногда ведёт себя странно: учимся думать как JS-движок

Когда вы только начинаете учить JavaScript, легко запомнить синтаксис и повторять за примерами. Но иногда код ведёт себя не так, как ожидается, и без понимания, как движок выполняет инструкции, разобраться трудно.

Сумит Саха на freeCodeCamp разбирает, как устроен JavaScript изнутри: область видимости переменных, замыкания, события и асинхронность. Не просто синтаксис, а то, что происходит за кулисами.

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

dc.send(file) не существует: что на самом деле нужно для передачи файла в браузере

Код из туториала по WebRTC-файлообмену выглядит убедительно: чанки в цикле, метка transfer_done в конце. Я бы не тащил такое в прод. dc.send() кладёт данные в SCTP-буфер, но не гарантирует их уход в сеть. На медленном relay прогресс может показать 100%, а файл на диске получателя окажется обрезан.

Автор собрал шесть таких ловушек: объект File не переживёт refresh, получатель может не быть готов к записи, а peer_left иногда — штатное завершение, а не ошибка. Разобрал здесь, если делаете P2P-передачу в браузере, советую проверить, где вы пишете свою надёжность поверх DataChannel.

Fetch API в JavaScript: как браузер просит данные у сервера

Когда вы учите JS, наступает момент, когда хочется не просто менять страницу, а получать реальные данные и обрабатывать их. Fetch API — это встроенный способ браузера (и Node.js 18+) отправить сетевой запрос и получить ответ.

Главная ловушка для новичка: fetch() не считает ошибку 404 или 500 настоящей ошибкой. Запрос всё равно выполнится, и его нужно проверять через response.ok или response.status. Иначе программа молча проглотит битый ответ.

Чтобы закрепить, откройте консоль браузера, сделайте простой запрос на получение данных к любому открытому API и выведите результат. Подробнее — в туториале DigitalOcean.

В npm снова нашли малварь под видом PostCSS-плагинов

Исследователи из JFrog обнаружили три вредоносных пакета, которые маскируются под знакомые инструменты веб-разработки. Самый заметный — postcss-minify-selector-parser с 615 загрузками; ещё postcss-minify-selector (256) и aes-decode-runner-pro (145). Все трое опираются на легитимный postcss-selector-parser, чтобы выглядеть правдоподобно, но при установке разворачивают Windows-RAT (remote access trojan) через PowerShell и Python.

Цепочка простая: JS-дроппер пишет settings.ps1, который качает ZIP с nvidiadriver[.]net и запускает update.vbs. Внутри — Python-рантайм, загрузчик loader.py и нативные модули, которые крадут пароли Chrome, собирают данные хоста и отправляют их на командный сервер. Я бы лично проверил package-lock.json на эти имена, особенно если CI ставит зависимости без ручного аудита.

Почему CSS @function ведёт себя как замыкание в JS

Если вы проектируете компоненты или библиотеки, @function может упростить API: кастомная CSS-функция видит переменные не только там, где определена, но и в точке вызова. Это похоже на замыкание — переменные из контекста вызова становятся доступны внутри функции.

Обычно --var наследуется вниз по DOM, а @function ломает эту привычку: при вызове она получает доступ ко всем переменным текущего контекста. В статье разбирают, как использовать это для тем, размеров и палитр без лишних аргументов.

Я бы сохранил паттерн для дизайн-систем: задаёте --theme и --size-1 на корне, а функция сама подхватывает их там, где вызвана. Меньше дублирования и меньше шанса забыть пробросить значение в параметры.

HTML научат обновлять часть страницы без JavaScript

Если вы учите веб-разработку, полезно понимать, как браузер получает страницу кусками. Сервер может сначала отправить шапку, потом боковое меню, а потом основной текст. Но если один блок тормозит на сервере, всё остальное ждёт его в очереди.

Сейчас это обходят фреймворки и библиотеки вроде HTMX с помощью JavaScript. Предложение в Chrome добавляет в сам HTML маркеры-заполнители: сервер сначала говорит «сюда потом придёт контент», а когда он готов, браузер подставляет его в нужное место — без скриптов.

Это не готово для настоящих сайтов, но помогает понять потоковую загрузку и частичные обновления изнутри. Разбор с примерами синтаксиса: откройте статью и найдите маркер-заполнитель — увидите, как HTML делится на «сейчас» и «потом».

Как в Cloudflare шесть недель ловили баг в HTTP-библиотеке hyper

Если вы пишете веб-сервисы на Rust, я бы сохранил этот разбор. Команда Cloudflare Images перешла на прямое локальное соединение через Unix-сокеты, и большие изображения стали иногда возвращаться обрезанными: HTTP 200, но тело короче Content-Length. В логах тишина.

Причина оказалась в hyper. Цикл poll_loop отбрасывал результат poll_flush, даже когда тот возвращал Poll::Pending. Баг существовал в версиях 0.14.x, 1.7 и 1.8, но прежний посредник читал данные быстро, и он не проявлялся. Cloudflare исправили его за четыре строки кода: flush теперь выполняется перед shutdown.

Как выбрать системного интегратора в 2026 году?

Выбор подрядчика — решение на несколько лет. Цена ошибки — суды или переписывание проекта с нуля. Не ошибиться всё-таки можно, если воспользоваться небольшим чек-листом для выбора подрядчика.

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

Всего критериев 12, обо всех подробно читайте в новом материале.

Deno соберёт веб-приложение в десктоп

Если вам надоели тяжеловесные Electron-обёртки, Deno предлагает альтернативу. В мажорном релизе Deno добавит команды для сборки десктопа из TypeScript, Next.js, Astro, Fresh, TanStack Start или Vite SSR. Я бы сохранил: переносим веб-приложение в окно почти без лишних движений.

Главный поворот — нативный WebView вместо встроенного Chromium (CEF). Приложение на WebView в macOS весит около 68,5 МБ, а на CEF выходит 308,9 МБ и стартует медленнее. Меню, диалоги и уведомления уже есть, а вот диалог выбора файла и API буфера обмена пока нет, мобильную версию обещают позже.

В прод я бы это пока не нёс: нестабильно, и WebView на старых машинах может вести себя непредсказуемо. Но за развитием стоит следить.

Conduit: API-шлюз с TypeScript-плагинами вместо redeploy

Если gateway на Go разрастается лапшой из префиксов, правка auth ведёт к новому деплою. Автор Conduit вынес эту боль в отдельный слой: Go занимается routing, proxying, CORS и SSRF-защитой, а логика авторизации, логирования и правил маршрутизации живёт в sandboxed Deno runtime как TypeScript-плагины.

Go и Deno общаются через Unix-сокет со strict snapshot-and-patch протоколом. Меняете файл плагина, сохраняете, и gateway не пересобирается. На хосте уживаются разные схемы доверия: HMAC-сессии для user/chat и JWT для admin с X-Gateway-Admin-заголовками.

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

Вашу фичу могут поломать костыли браузеров под крупные сайты

Если вы тестируете новую фичу только в Chrome и считаете, что этого достаточно — стоит пересмотреть. Safari и Firefox хранят в движках списки исключений для гигантов вроде TikTok, Netflix, Instagram, Facebook, X и Reddit: рендер, события и медиа там работают не так, как на обычных сайтах.

Firefox показывает их в about:compat — инъекции CSS/JS, подмена user-agent и костыли под конкретный домен. У Safari это Quirks.cpp в WebKit: например, для Facebook, X и Reddit видео не ставится на паузу, когда уходит из вьюпорта, но остаётся в PiP.

К чему это вам: если ваша фича использует embedы, видео, соцлогины или интеграции с такими доменами, поведение в Safari/Firefox может отличаться от Chrome. Разбор от Staff Engineer из Canva.

Gleam — это функциональный язык, который компилируется в Erlang и JavaScript.

Тестируйте Vue-компоненты в браузере, без Node и сборки

Мне давно не хватало лёгкого способа гонять фронтенд-тесты без тяжёлого Node-окружения. Playwright хорош, но новый процесс браузера на каждый тест и Node-оркестрация быстро утомляют. Автор jvns.ca пошёл другим путём: вместо отдельного браузера запускает интеграционные тесты Vue-компонентов прямо в открытой вкладке.

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

Если у вас небольшой Vue-проект без Node-сборки, я бы попробовал такую схему в QA перед релизом. Подробности в заметке.

VPS vs VDS vs виртуальный хостинг: что выбрать в 2026

Часто сервер выбирают по цене, а потом упираются в нехватку ресурсов, гибкости или поддержки. И почти никто не знает главного: VPS и VDS — это в большинстве случаев одно и то же, разница только в названии. Реально выбор идёт между хостингом (провайдер всё настроил, но конфигурация ограничена) и изолированным сервером с root-доступом.

В подборке 6 провайдеров под разные сценарии: от старта на виртуальном хостинге за ~123 рубля в месяц до VPS с зарубежными локациями. Внутри реальные цены, лимиты, условия по бэкапам, тестовым периодам и подсказки как сделать правильный выбор для своего случая.

Украл идею, чертяка