Разберём микрофронтенд через историю вымышленного хакера — и заодно поймём, почему это спрашивают на собеседованиях.Статья собрана по заметкам в телеграм канале.Недавно на собесе меня спросили: "А как именно работают микрофронты? Там что, прямо eval используют?"Я что-то промямлил про expose, host, сборку... и понял, что вообще не понимаю сути. Знакомо?После этого я потратил неделю на изучение webpack изнутри. Чтобы запомнить материал, придумал историю про горе-хакера.Это образовательная…
Декларативные шаблоны Vue решают 90% задач фронтенда. Но периодически возникают ситуации, где шаблонного синтаксиса оказывается мало. Нужен более тонкий контроль над рендерингом или возможность вынести часть компонента за пределы его естественной позиции в DOM-дереве. Для таких случаев Vue 3 послал нам render-функции и встроенный компонент Teleport.Проблема, которую решают рендер-функцииVue компилирует шаблоны в JavaScript-функции автоматически. Пишем <div>{{ text }}</div>, а Vue пр…
Сколько будет корень из нуля? Даже школьник ответит не задумываясь: ноль. Но если задать этот вопрос JIT‑компилятору Maglev внутри движка V8, то при определённых обстоятельствах он сначала скажет: «ноль», а потом решит сэкономить на проверке безопасности и отдаст злоумышленнику доступ к памяти браузера.Меня зовут Паша Кузьмин, я занимаюсь практической безопасностью Яндекс Браузера и проекта Chromium. В нашей команде мы регулярно разбираем уязвимости и исследуем методы атак — чтобы защищать поль…
Что это простыми словами?Мультиплексирование — это технология, позволяющая передавать несколько независимых потоков данных через одно физическое соединение. Представьте официанта в ресторане, который несёт один поднос с заказами для десяти разных столиков, вместо того чтобы делать десять отдельных ходок. Техническое определение: Совместное использование общего ресурса (канала связи, сокета, порта) для одновременной передачи множества логических потоков данных. Почему это важно в наше время?В эп…
«А сегодня в завтрашний день не все могут смотреть. Вернее смотреть могут не только лишь все, мало кто может это делать»Для сравнения доходности торговых стратегий применяют бектест, прокрутка исторических данных для симуляции как алгоритм поведёт себя в той или иной ситуации. Look-ahead bias - когда бэктест подглядывает в будущее. То есть, использует данные, которых в момент принятия решения ещё не было. // Прямая передача массива с историческими данными function shouldBuy(candles, idx) { …
Команда JavaScript for Devs подготовила перевод статьи о CSS Grid Lanes — новом подходе к masonry-раскладкам, который наконец-то становится нативной частью CSS. Grid Lanes используют всю мощь CSS Grid, работают без JavaScript, учитывают доступность и дают дизайнерам и разработчикам гибкость, о которой раньше можно было только мечтать. Разбираемся, как это работает и почему это важный шаг вперёд для веба. Он уже здесь — будущее «каменных» (masonry) раскладок в вебе. После фундамента, заложенног…
В компьютерных сетях (как и, в принципе, при любой передаче информации) есть и всегда будут существовать две задачи:конфиденциальность (confidentiality) - я отправляю письмо Маше, это всем известно, но что в этом письме - можем прочитать только мы с Машейанонимность (anonymity) - все могут прочитать содержимое письма, но от кого оно и куда - непонятно (понимаем только мы с Машей)Соответственно, имея те или иные цели есть множество решений этих задач.Итак, хорошо. Вот я подключаюсь к своему люби…
Оригинальная игра Battle City (1985)Всегда хотел сравнить ИИ модели на чем-то наглядном и с большим творческим потенциалом. Если попросить ИИ решить школьную задачу по математике, то, скорее всего, все справятся на отлично, тут и сравнивать нечего. Если попросить решить более сложную задачу, то уже придется объяснять читателям, кто из ИИ прав, а кто не очень. Создание компьютерной игры по мотивам хита 80-х, да и еще работающей в мобильном и десктоп браузере, кажется идеальной задачей для сравне…
Привет, Хабр! Представляю shadcn-glass-ui — React-библиотеку с glassmorphism-эффектами, которая устанавливается поверх существующих shadcn/ui проектов за 2 команды. Никакой миграции, никакого переписывания кода — просто добавьте glass-варианты ваших компонентов.DemoTL;DR# Добавьте registry в components.json npx shadcn@latest add @shadcn-glass-ui/button-glass # Используйте рядом с обычными компонентами import { Button } from '@/components/ui/button'; import { ButtonGlass } from '@/c…