В Web Component с открытым Shadow DOM внутри нажали кнопку. На document висит обычный click-слушатель (не capture). Что он увидит по умолчанию?
Anonymous Quiz
31%
Событие дойдёт; event.target — хост; в composedPath() будет внутренняя кнопка
37%
Событие не выйдет из тени — всплытие остановится на shadowRoot
21%
Дойдёт; event.target — реальная внутренняя кнопка
10%
Дойдёт только в capture, в bubble — нет
Please open Telegram to view this post
VIEW IN TELEGRAM
Нужно хранить аутентификацию в SPA так, чтобы токен нельзя было украсть XSS и работало на поддоменах, при этом защититься от CSRF. Что выбрать?
Anonymous Quiz
12%
localStorage + Bearer в заголовке
66%
HttpOnly Secure cookie с Domain=.example.com, SameSite=Lax/Strict + CSRF-токен/Origin-проверка
15%
sessionStorage + Bearer
7%
Токен в URL-фрагменте (#token)
Я показываю, почему выбраковываю margin: перехожу на gap, даю лишние обёртки ради независимости узлов. Итог — чище код и предсказуемые отступы. Будут примеры и возражения.
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
API-ответы должны приходить сразу, можно 30 с устаревшие с фоновым обновлением; при сетевой ошибке — использовать старый до 1 ч. Какие заголовки отдать?
Anonymous Quiz
4%
Cache-Control: max-age=0, must-revalidate
71%
Cache-Control: public, max-age=30, stale-while-revalidate=30, stale-if-error=3600
16%
Cache-Control: no-store, stale-while-revalidate=30
10%
Cache-Control: s-maxage=30, must-revalidate
Покажу свежие фишки HTML/CSS, которые уже поддерживаются: что они чинят, где применить, на что смотреть. Короткие примеры, ссылки и мои фавориты — чтобы выбрать, что копать глубже.
Please open Telegram to view this post
VIEW IN TELEGRAM
Новый Service Worker установился, но пользователи видят старую версию до перезапуска вкладок. Как применить обновление сразу?
Anonymous Quiz
10%
Увеличить версию кеша и ждать
48%
Поставить Cache-Control: no-store на все ассеты
37%
Вызвать skipWaiting() и затем clients.claim()
6%
Понизить TTL у SW и перезагрузить страницу через таймер
This media is not supported in your browser
VIEW IN TELEGRAM
Сделана на CSS, SVG и JavaScript
Please open Telegram to view this post
VIEW IN TELEGRAM
❤3
value
в JavaScript и когда его применять?Свойство
value
позволяет получить или изменить текущее значение элементов форм — таких как <input>
, <textarea>
или <select>
. Это основной способ работы с пользовательским вводом на стороне фронтенда.<input id="nameInput" type="text" placeholder="Введите имя">
<script>
const input = document.getElementById("nameInput");
input.value = "Alice"; // Установим значение
console.log(input.value); // Получим текущее значение ➜ "Alice"
</script>
value удобно использовать для работы с формами, валидацией, автозаполнением, поиска и динамического изменения данных. Это ключевой инструмент при создании интерактивных интерфейсов.
Please open Telegram to view this post
VIEW IN TELEGRAM
❤1
Какой кросс-доменный запрос не вызовет CORS preflight в браузере?
Anonymous Quiz
28%
GET с заголовком X-Token: abc
22%
POST с Content-Type: application/json
41%
POST с Content-Type: application/x-www-form-urlencoded, без доп. заголовков
9%
PUT с Content-Type: text/plain
This media is not supported in your browser
VIEW IN TELEGRAM
Сделана на чистом CSS
Please open Telegram to view this post
VIEW IN TELEGRAM
Используете <script type="module" src="app.js">. Нужно заранее подтянуть сам модуль и его импортируемые зависимости. Какой хинт выбрать?
Anonymous Quiz
26%
<link rel="modulepreload" href="app.js">
39%
<link rel="preload" as="script" href="app.js">
18%
<link rel="prefetch" href="app.js">
17%
defer на <script>
Разберу деструктуризацию в JS на примерах: изъятие значений, пропуски, значения по умолчанию, rest/спред, частые ловушки. Коротко и практично.
Please open Telegram to view this post
VIEW IN TELEGRAM
This media is not supported in your browser
VIEW IN TELEGRAM
Сделана на чистом CSS
Please open Telegram to view this post
VIEW IN TELEGRAM
Нужно ограничить сессионный cookie точным хостом (без поддоменов) и требовать HTTPS. Как правильно его установить?
Anonymous Quiz
12%
Имя __Host-session; Secure; Path=/; HttpOnly; без Domain
40%
Имя __Secure-session; Secure; Domain=.example.com; Path=/; HttpOnly
19%
Обычный cookie; SameSite=Strict; Domain=.example.com; Secure
30%
Имя __Host-session; Secure; Domain=example.com; Path=/; HttpOnly
Это еще одна статья про разбор ошибок и аварий, но с точки зрения небольших фич фронта, которые вы можете внедрить самостоятельно и упростить свою работу, а также помочь отделу в целом.
Please open Telegram to view this post
VIEW IN TELEGRAM
INP высокий — интерфейс «тупит» при кликах/вводе. Что в первую очередь поможет снизить INP?
Anonymous Quiz
12%
Предзагрузка шрифтов и CSS
20%
Перевести на ESM, включить code-splitting и HTTP/2 push
12%
Сжать изображения до AVIF/WebP
55%
Дробить long tasks, делать yield/await, убирать тяжёлое из обработчиков