Из блога OpenReplay
Первый взгляд на HTML Sanitizer API
HTML Sanitizer API встраивает защиту от XSS в браузер; рассматриваются безопасные методы, DOMPurify и настройка списков разрешённых элементов.
Как найти DOM-элементы по тексту
Статья рассматривает фильтрацию через querySelector, обход TreeWalker и XPath с document.evaluate для выбора DOM-элементов по текстовому содержимому.
Лучшие CDN для современных веб-приложений
Сравнение Cloudflare Workers, Fastly Instant Purge, AWS CloudFront и Akamai Ion помогает выбрать подходящий CDN для фронтенд-архитектуры и edge-логики.
Начало работы с Laravel Livewire
Livewire позволяет строить динамические UI на Laravel через PHP-компоненты и Blade-шаблоны с автоматической валидацией форм и реактивными обновлениями DOM.
Изучаем CSS-функцию random()
CSS-функция random() генерирует числовые значения прямо в стилях, заменяя JavaScript для визуации; поддерживает синтаксис, ключи кэша и fallback-значения.
Стилизация элементов Select с помощью современного CSS
Стилизация select через appearance none и base-select, применение clip-path и focus spans с прогрессивным улучшением в браузерах средствами CSS.
Real-Time UX с расширением htmx SSE
Расширение SSE для htmx позволяет добавить real-time интерфейс в проекты, используя server-sent events и HTML-атрибуты без подключения JavaScript-фреймворков.
Почему следует быть осторожным с оператором `!` в TypeScript
Оператор ненулевого утверждения в TypeScript заглушает компилятор без защиты во время выполнения, превращая ошибки компиляции в трудноотслеживаемые null-сбои.
Относительный синтаксис цвета в CSS: подробное объяснение
Относительный синтаксис цвета в CSS позволяет получать тинты, тени и варианты прозрачности из одного исходного цвета с помощью OKLCH и других цветовых функций.
Написание более чистых асинхронных цепочек с Promise.try
Promise.try перехватывает синхронные исключения как rejection, сохраняя цепочки чистыми; рассматриваются альтернативы и паттерны условной загрузки данных.
Что такое Babylon.js? Краткое введение
Babylon.js - JavaScript-движок для 3D с открытым кодом на базе WebGL и WebGPU. Статья показывает отличия от Three.js и возможные сценарии применения.
Понимание динамических единиц viewport в CSS
CSS-единицы svh, lvh и dvh устраняют обрезку макета браузерным chrome на мобильных устройствах и позволяют выбрать нужную единицу для адаптивных макетов.
Как защитить сайт на WordPress
Защита сайта на WordPress включает обновление плагинов, включение 2FA, настройку прав доступа к файлам и развертывание WAF, например Cloudflare или Wordfence.
Что находится внутри HTTP-ответа?
HTTP-ответы состоят из строки статуса, заголовков и тела; знание каждой части помогает отлаживать запросы в DevTools и грамотно обрабатывать результаты fetch.
Аргументы в пользу чистого JavaScript вместо фреймворков
Разбор сценариев, в которых vanilla JavaScript, Web Components, ES modules и нативные браузерные API превосходят React или Vue для конкретных frontend-проектов.
Скрытые возможности Chrome DevTools
Возможности Chrome DevTools за пределами основ: CSS Overview, Logpoints, вкладка Coverage и отладка Layout Shift для улучшения производительности.
Знакомьтесь с UnJS: фреймворк-агностичные инструменты для JavaScript
Обзор экосистемы UnJS: как инструменты Nitro, h3, ofetch и unplugin обеспечивают JavaScript-инфраструктуру независимо от среды выполнения и фреймворка.
Основные команды npm, которые должен знать каждый разработчик
npm CLI охватывает аудит зависимостей, запуск скриптов и закрепление транзитивных зависимостей; команды помогают отлаживать деревья и устранять уязвимости.
Как OpenUI формирует веб-компоненты
OpenUI стандартизирует UI-паттерны через Popover API, Invoker Commands API и настраиваемый CSS для select, снижая зависимость от пользовательского JavaScript.
Как исправить ошибку 'Cannot use import statement outside a module'
Разбор причин ошибки cannot use import statement outside a module в Node.js, браузерах и Jest с правильной диагностикой конфликта систем модулей.
Как лениво загружать компоненты в Svelte
Ленивая загрузка компонентов Svelte через динамические импорты и условный рендеринг сокращает начальный бандл в проектах на SvelteKit и Vite.
Разрешение Local Network Access (LNA) в Chrome: подробное объяснение
Разрешение Chrome Local Network Access блокирует доступ публичных сайтов к локальным устройствам; статья описывает триггеры LNA-запроса и его обработку в веб-приложении.
ASCII-арт в браузере и терминале
Разбор отображения яркости пикселей в символы, расширения ASCII-арта через Unicode Braille и блочные элементы, рендеринга в Canvas, WebGL и ANSI-терминалах.
Как типизировать ответы API в TypeScript
Типизация ответов API через интерфейсы, схемы Zod и генерацию OpenAPI предотвращает несоответствия данных в runtime и сохраняет точность типов.