gram news
Какие-то уроки [Frontend] channel avatar

Какие-то уроки [Frontend]

@kakietoyroki

Фронтенд новости и полезности. А также гадости про бэкендеров (чтоб блин нахрен не расслаблялись)

ProjectsRUProgramming

2,090subscribers

Open the Channel

Latest posts

  • Какие-то уроки [Frontend]

    23 May, 09:38edited

    🚀 No-Vary-Search - улучшаем кэш браузераЕсть страница товара: /product/123А пользователи из-за маркетологов приходят на неё из разных источников:/product/123?utm_source=google /product/123?utm_source=telegram /product/123?fbclid=abc /product/123?gclid=xyzДля аналитики это полезно. Но для страницы товара это ведь один и тот же HTML.🆕 И тут помогает новый HTTP header: No-Vary-Search (который работает пока что только в хроме 😁)Таким заголовком мы говорим браузеру: "Эти query-параметры не меняют ответ, их можно не учитывать при поиске в кэше."No-Vary-Search: params=("utm_source" "utm_medium" "utm_campaign" "fbclid" "gclid")
    1,45032Open in Telegram
  • Какие-то уроки [Frontend]

    22 May, 08:06

    💅 Начался опрос State of CSS 2026Если скучно, то можете на вопросики поотвечать, а заодно, пока заполняешь анкету, 100% наткнешься на новые для себя свойства и селекторы, о которых даже не слышал. Проведешь время с пользой 🙃Источник: https://survey.devographics.com/en-US/survey/state-of-css/2026#новости
    Image from a post by Какие-то уроки [Frontend]Image from a post by Какие-то уроки [Frontend]
  • Какие-то уроки [Frontend]

    21 May, 22:51

    🤨 Теперь NextJSЧота много последнее время взламывать начали. Новость старая, но мб вы пропустили (как пропустил я 🥲)В NextJS обнаружили серьёзную уязвимость за всю его историюЗатронуты версии: 13.4.13+, 14.x, 15.x и 16.0.0–16.2.4 Злоумышленники могут получить доступ к вашим внутренним сервисам, админкам, api ключам‼️Обновитесь до 15.5.18 или 16.2.6Источник: https://github.com/vercel/next.js/security/advisories/GHSA-c4j6-fc7j-m34r#новости
    Image from a post by Какие-то уроки [Frontend]Image from a post by Какие-то уроки [Frontend]
    1,37092Open in Telegram
  • Какие-то уроки [Frontend]

    14 May, 13:18edited

    Если вдруг используете приложение из 3х букв и надоело его включать/выключать, то горячо рекомендую включить роутинг1 кнопка и проблема решена (выбирайте пункт "Быстрая установка" и не заморачивайтесь)https://github.com/hydraponique/roscomvpn-routing
    GitHubGitHub - hydraponique/roscomvpn-routing: Custom routing rules for Happ, INCY, Mihomo with DeeplinkCustom routing rules for Happ, INCY, Mihomo with Deeplink - hydraponique/roscomvpn-routing
    1,880103Open in Telegram
  • Какие-то уроки [Frontend]

    13 May, 14:01edited

    🫠 TanStack взломалиВ npm-пакеты @tanstack/ попал вредоносный код нацеленный на кражу учётных данных и секретов из CI/CD-сред Под ударом было 84 версии в 42 пакетах (@tanstack/react-router, @tanstack/router-, итд)Вредоносный код можно было словить при помощи обычного npm iИ скрипт мог попытаться украсть секреты из окружения. Что он искал: • GitHub токены • npm токены • AWS ключи • Vault токены • Kubernetes service account • CI/CD secrets • .env и другие чувствительные данныеЕщё хуже: он мог закрепляться в проекте через: • .claude/settings.json • .claude/router_runtime.js • .vscode/tasks.json
    Image from a post by Какие-то уроки [Frontend]Image from a post by Какие-то уроки [Frontend]
    1,94025Open in Telegram
  • Какие-то уроки [Frontend]

    17 Apr, 13:28

    ‼️ 3G в Chrome ненастоящийChrome плохо эмулирует медленную сеть. Из-за этого значения в DevTools могут быть хуже, чем на реальном девайсе с плохой сетью.Почему? Потому что реальный интернет работает через пакеты, а Chrome - упрощает всё до запросов.В жизни: • данные разбиваются на маленькие куски (пакеты) • сервер может отправлять их с приоритетом (важное -> быстрее) • часть пакетов может теряться и пересылаться заново • есть задержки: DNS, TCP, TLS и т.д.В DevTools: • скорость просто режется и делится между запросами • нет нормальной симуляции потерь пакетов • многие сетевые задержки не учитываются👉 В итоге получается не "медленный интернет", а его грубая имитация
    Image from a post by Какие-то уроки [Frontend]Image from a post by Какие-то уроки [Frontend]
    2,080171Open in Telegram
  • Какие-то уроки [Frontend]

    2 Apr, 11:35

    🙈 Axios взломалиВ npm-пакет Axios попал вредоносный код - киберкотлеты взломали личный профиль одного из мейнтейнеров этого проекта и опубликовали от его имени вредоносные версии этой библиотеки.Заражённые версии: • 1.14.1 • 0.30.4Внутри был не сам код axios, а зависимость plain-crypto-js, которая через postinstall ставила троян.⏱️ Они прожили всего ~3 часа, но этого хватило, чтобы попасть в CI/CD и прод. Если ты сделал npm install в 00:21 - 03:15 по UTC, то:• проверить lockfile на axios@1.14.1 или 0.30.4 • удалить node_modules + lockfile и пересобрать проект • срочно отозвать ВСЕ секреты (npm, GitHub, AWS, env и т.д.) • проверить CI/CD (если там был install в это время) • зафиксировать версии на безопасные (1.14.0 / 0.30.3)Источник: https://www.cnews.ru/news/top/2026-03-31_milliony_programmistov_v
    Image from a post by Какие-то уроки [Frontend]Image from a post by Какие-то уроки [Frontend]
    2,480172Open in Telegram
  • Какие-то уроки [Frontend]

    24 Mar, 17:56

    https://www.web-rewind.com/Очень залипательно
    Image from a post by Какие-то уроки [Frontend]Image from a post by Какие-то уроки [Frontend]
    2,50084Open in Telegram
  • Какие-то уроки [Frontend]

    21 Mar, 14:45

    Отмечаю выпуск курса ))))
    Image from a post by Какие-то уроки [Frontend]Image from a post by Какие-то уроки [Frontend]
    2,6604472Open in Telegram
  • Какие-то уроки [Frontend]

    21 Mar, 12:58

    🎉 Друзья, привет, я тут с анонсомОчень много людей мне пишет про курс по NextJS, поэтому я решил опубликовать его в общий доступЕсли что, то он написан пока что только наполовину, но это уже около 10 часов видео контента и 40 вопросовКурс полностью практический, то есть мы не затрагиваем сухую документацию, а пишем реальное приложение: клон YouTube. На скрине как раз то, как сейчас выглядит проектВсе 10 часов выложил в бесплатный доступ. Последующие темы уже будут платные, но из-за того, что он не дописан, я сделал большую скидку. Можно купить сейчас, чтоб в будущем заплатить меньше :)Чуть позже выложу весь этот курс еще и на ютубСам курс: https://stepik.org/a/252262
    Image from a post by Какие-то уроки [Frontend]Image from a post by Какие-то уроки [Frontend]
    2,5204121Open in Telegram
  • Какие-то уроки [Frontend]

    17 Mar, 14:05edited

    🥰 Vite 8У Vite вышла новая мажорная версияИз важного: 1. Новый бандлер Rolldown (Rust) - теперь единый пайплайн вместо Rollup + esbuild 2. Сильный буст скорости: до ~x10-30 на прод-сборке 3. Плагин для DevTools: https://devtools.vite.dev/Источник: https://vite.dev/blog/announcing-vite8#новости
    Image from a post by Какие-то уроки [Frontend]Image from a post by Какие-то уроки [Frontend]
    2,22024Open in Telegram
  • Какие-то уроки [Frontend]

    11 Mar, 19:51

    🍭 Popover API или Dialog API?Недавно же поповеры и диалоги вышли. А в чем разница? Какой и когда использовать? Нашел тут статью, где можно об этой почитатьКоротко: • Popover API - упрощает создание всплывающих элементов • Dialog API - лучше подходит для модальных оконP.S. В комментарии скинул сжатый перевод от ГПТ этой статьи на русском (хз насколько вам зайдет нейроперевод, но выглядит хорошо)Источник: https://css-tricks.com/popover-api-or-dialog-api-which-to-choose#html
    Image from a post by Какие-то уроки [Frontend]Image from a post by Какие-то уроки [Frontend]
    2,330132Open in Telegram
  • Какие-то уроки [Frontend]

    10 Mar, 18:29

    Телеграм - это единственная соц. сеть, где каждый новый пост не прибавляет подписчиков, а уменьшает их. ПИЗДЕЦ )))))))
    2,1303695211Open in Telegram
  • Какие-то уроки [Frontend]

    10 Mar, 18:27

    и сразу минус 2 потпищека..... а вы говорите, что роблокс это круто...................
    2,170311Open in Telegram
  • Какие-то уроки [Frontend]

    10 Mar, 18:24

    Ухожу из фронтенда!!!!!Теперь буду снимать обзоры на домофоны и поезда Еще буду фури-фанфики озвучивать для анимешников И скорее всего делать прохождение карт в роблоксе....А вы и дальше свои эти кнопки сраные на 3 пикселя влево двигайте
    2,1902987421Open in Telegram
  • Какие-то уроки [Frontend]

    10 Mar, 08:02

    🆕 HTML Sanitizer API ⛔️Нам тут под шумок новую апишку завезли. Пока что только в Firefox работает, но мне уже нравится, что такое появилось и когда-нибудь будет доступно обычным работягам.Идея очень простая: удалять потенциальный XSS, перед вставкой в DOM.Настраиваем санитайзер, указываем какие тэги или атрибуты доступны:const sanitizer = new Sanitizer({ elements: ["p", "div"], attributes: ["onclick"], });Теперь находим нужный HTML элемент:const el = document.getElementById("target"); const myHTML = '<script>alert(1)</script>'И вставляем myHTML внутрь el, предварительно обработав санитайзером:
    2,090158Open in Telegram
  • Какие-то уроки [Frontend]

    4 Mar, 15:19

    Коты тоже залипли 😁
    Image from a post by Какие-то уроки [Frontend]Image from a post by Какие-то уроки [Frontend]
    1,97020Open in Telegram
  • Какие-то уроки [Frontend]

    4 Mar, 15:17

    🫨 HapticНашел прикольную и залипательную библиотеку web-hapticsЭто маленькая JS-библиотека, которая имитирует чувство прикосновения через вибрацию и звукТо есть вместо navigator.vibrate([10, 20, 10]); можно использовать haptics.success()У библиотеки уже куча готовых паттернов, а еще очень залипательный сайт Рекомендую зайти и потыкать: https://haptics.lochie.me/Работает с React, Vue, Svelte:import { useWebHaptics } from "web-haptics/react";const { trigger } = useWebHaptics();<button onClick={() => trigger()}>Tap me</button>Источник: https://x.com/lochieaxon/status/2028514678784291175
    2,360video2031Open in Telegram
  • Какие-то уроки [Frontend]

    3 Mar, 07:29

    ⚙️ <Img decoding="async" />Важный атрибут у тэга img, который стоит знать - decodingКогда браузер встречает:<img src="photo.jpg" />Происходит 3 этапа: • Загрузка файла (network) • Декодирование (JPEG/PNG -> пиксели в памяти) • Отрисовка на экран⚠️ Важно: декодирование происходит в отдельном потоке и само по себе не блокирует основной поток.Но! Перед тем как браузер нарисует следующий кадр страницы, он может решить: 1. подождать, пока изображение будет готово 2. не ждать и показать всё остальное сразу
    Image from a post by Какие-то уроки [Frontend]Image from a post by Какие-то уроки [Frontend]
    1,7402853Open in Telegram
  • Какие-то уроки [Frontend]

    2 Mar, 10:30edited

    🤨 Оператор --> в JSВ JS есть скрытый оператор длинной стрелки, который уже очень давно поддерживается и упрощает работу.Посмотрите на этот пример кода:let len = 3;while (len --> 0) { console.log(len) // 2, 1, 0 }Знаете ли вы как работает оператор -->? На самом деле, это ржака и такого оператора нет)Тут просто комбинация двух операторов:while ( (len--) > 0 )Надеюсь, что вы поверили )))
    1,5005431Open in Telegram