Тема: browser
-
Хранилища браузера: сравнение cookie, Web Storage и IndexedDB
Cookie передаются с каждым запросом и по спецификации имеют небольшой размер. localStorage и sessionStorage — синхронные строковые хранилища с несколькими MiB на источник; IndexedDB асинхронна, поддерживает транзакции и использует большую общую квоту источника. Без предоставленной постоянности браузерное хранение выполняется по возможности и ограничивается источником.
-
Политика одного источника: что такое источник и что она изолирует
Источник определяется схемой, хостом и портом URL. Скрипт может читать и изменять документы, хранилища и ответы того же источника. Межисточниковое чтение по умолчанию запрещено, тогда как запись, например отправка форм, и встраивание изображений или скриптов обычно разрешены. CORS ослабляет ограничения чтения; защита от CSRF по-прежнему нужна.
-
Using fetch with timeouts and AbortController
A fetch promise rejects only on network failure, not on HTTP error status, and it has no timeout by itself. Pass an AbortSignal combined from AbortSignal.timeout and a caller's controller, check response.ok, and tell TimeoutError, AbortError, network errors and HTTP errors apart in the catch.
-
Web Vitals: что измеряют LCP, INP и CLS
Core Web Vitals — три метрики реального использования: Largest Contentful Paint — время отрисовки самого большого видимого элемента, ориентир 2.5 с; Interaction to Next Paint — наибольшая задержка взаимодействия, ориентир 200 мс; Cumulative Layout Shift — неожиданное смещение, ориентир 0.1. Каждую оценивают по 75-му перцентилю загрузок страниц.
-
Web Push basics: subscriptions, VAPID keys and the push service
A browser subscribes with its vendor's push service and hands the page an endpoint plus keys; the application server POSTs encrypted messages to that endpoint with a TTL header and a VAPID JWT (ES256, aud = push service origin, exp at most 24 hours) whose public key was passed to PushManager.subscribe as applicationServerKey. A 201 means accepted, not delivered.
-
Стабильные селекторы и автоматическое ожидание в сквозных браузерных тестах
В нестабильных браузерных тестах преобладают две причины: ломающиеся или неверно выбирающие элемент селекторы и паузы, основанные на предположениях о времени. Ищите элементы по роли, подписи или тестовому идентификатору, требуйте ровно одного совпадения и синхронизируйтесь повторяемыми проверками и проверками готовности к действию, а не временем.
-
CSS-компоновка: когда использовать flexbox, а когда grid
Flexbox — одномерная модель, распределяющая пространство вдоль строки или столбца; grid — двумерная и задаёт строки и столбцы вместе. Используйте flexbox для групп, размер которых определяет содержимое, а grid — для структуры страниц и форм; сочетайте их, применяйте gap и разрешайте элементам сжиматься, чтобы текст не выходил за границы.
-
When does progressive enhancement pay off for an application that needs JavaScript anyway?
Open question: for applications whose core features cannot work without script, which parts still deserve a working no-script or reduced-script path, how often does script fail to run for a real audience, and how should a team decide with data rather than principle?
-
The JavaScript event loop: tasks, microtasks and rendering
JavaScript runs one job at a time; the HTML event loop takes a task, then drains the whole microtask queue (promise reactions, queueMicrotask) before the next task or a rendering opportunity. Long synchronous work and endless microtask chains block input and painting.
Машиночитаемо: JSON