Category : javascript

javascript
Gately — мой симулятор логических схем: от «игрушки» к диплому

Привет, Хабр! Меня зовут Марк. Я студент, на протяжение последних двух лет уперто пилю один пет‑проект, который в этом учебном году защищаю как диплом. В статье — как я дошел до идеи сделать собственный симулятор логических схем, и во что он превратился.ПредысторияЕще в школе на меня сильно повлияла книга Чарльза Петцольда «Код»: впервые стало понятно, как компьютер устроен на самом простейшем уровне: транзисторы → логические элементы → схемы → поведение. На защите индивидуального проекта в 10 …

  • четверг, 13 ноября 2025 г. в 00:00:06
javascript
Идеально размещённые тултипы: база

Эта статья — перевод оригинальной статьи «Perfectly Pointed Tooltips: A Foundation», будут переводы ещё двух частейТакже я веду телеграм канал «Frontend по‑флотски», где рассказываю про интересные вещи из мира разработки интерфейсов.ВступлениеТултипы — классика веб-разработки. Кликаешь по элементу — и рядом всплывает небольшой «бабл» с дополнительной информацией. Но за этим простым кликом почти всегда стоит JavaScript, который рассчитывает, где именно показать тултип.Попробуем поставить его све…

  • среда, 12 ноября 2025 г. в 00:00:10
javascript
setHTML(), Trusted Types и Sanitizer API

❯ Поддержка браузеровРанняя версия Sanitizer API была реализована в Chrome, но позже была удалена. Поэтому не стоит ориентироваться на старые материалы — спецификация API со временем значительно изменилась.На данный момент Sanitizer API поддерживается в Firefox Nightly в соответствии с актуальной спецификацией. В Chrome Canary он также доступен, но только при включении специального флага. В Safari реализация пока не ведется, однако команда разработчиков Safari выразила поддержку этой инициативе…

  • среда, 12 ноября 2025 г. в 00:00:09
javascript
Slider с использованием Web Components + Shadow Dom

Продолжая тему из моей предыдущей статьи о веб-компонентах, я хочу подробнее рассмотреть их применение для решения реальных задач. Сегодня мы напишем простую, но полнофункциональную реализацию Слайдера, в процессе познакомившись с такими ключевыми концепциями, как Shadow DOM и Declarative Shadow DOM. Что нам даёт использование Shadow DOM: Возможность работать со слотами (<slot>) для композиции контентаПолная изоляция стилей компонента от глобальных таблиц CSSИнкапсуляция DOM-дерева комп…

  • вторник, 11 ноября 2025 г. в 00:00:20
javascript
Как сделать сайт бесконечно ленивым. Часть 1: Чем полезна ленивая загрузка

Ленивая загрузка - это принцип, который должен быть известен большинству frontend разработчиков. Однако, этот механизм обманчиво прост, и его освоение является гораздо более комплексной задачей, чем кажется многим. Если вы уже используете Lazy Loading, у вас все равно могут быть серьезные пробелы в знаниях. Но даже если вы считаете, что знаете про ленивую загрузку абсолютно все, освежить память не будет лишним.Содержание серииЧасть 1: Чем полезна ленивая загрузка || English versionЧасть 2: Граф…

  • вторник, 11 ноября 2025 г. в 00:00:19
javascript
Как сделать сайт бесконечно ленивым. Часть 2: Графы зависимостей

И снова здравствуй. И добро пожаловать во вторую часть моего ультимативного гайда. Приготовься — скоро ты станешь настоящим профи.Содержание серииКак сделать бесконечно ленивым: Ультимативный гайд.Часть 1: Чем полезна ленивая загрузка || English versionЧасть 2: Графы зависимостей || English versionЧасть 3: Вендоры и кэш || English versionЧасть 4: Преждевременная загрузка || English versionРанее мы обсуждали самые основы ленивой загрузки и то, почему она вообще важна. А в этой статье мы рассмотр…

  • вторник, 11 ноября 2025 г. в 00:00:18
javascript
Как сделать сайт бесконечно ленивым. Часть 3: Вендоры и кэш

И снова здравствуй. И добро пожаловать в третью часть моего ультимативного гайда. Приготовься — скоро ты станешь настоящим профи.Содержание серииКак сделать бесконечно ленивым: Ультимативный гайд.Часть 1: Чем полезна ленивая загрузка || English versionЧасть 2: Графы зависимостей || English versionЧасть 3: Вендоры и кэш || English versionЧасть 4: Преждевременная загрузка || English versionРанее мы поговорили о том, как сделать дерево зависимостей нашего проекта максимально чистым и почему это ва…

  • вторник, 11 ноября 2025 г. в 00:00:16
javascript
Как сделать сайт бесконечно ленивым. Часть 4: Преждевременная загрузка

И снова здравствуй. И добро пожаловать в четвертую часть моего ультимативного гайда. Приготовься — скоро ты станешь настоящим профи.Содержание серииКак сделать бесконечно ленивым: Ультимативный гайд.Часть 1: Чем полезна ленивая загрузка || English versionЧасть 2: Графы зависимостей || English versionЧасть 3: Вендоры и кэш || English versionЧасть 4: Преждевременная загрузка || English versionРанее мы говорили о том, как улучшить кэширование наших проектов и правильно загружать вендоры. А в этой …

  • вторник, 11 ноября 2025 г. в 00:00:15
javascript
Что такое API? Простыми словами для Начинающих

API. Это слово звучит в каждой статье, в каждой вакансии, в каждом разговоре разработчиков. Но когда гуглишь, что это, вываливается тонна заумных определений про «программные интерфейсы приложений», от которых мозг плавится.Так что сегодня объясню, что такое API, так, что ты точно поймешь: на простых примерах, интересно, да еще и с крутой графикой. Уже через несколько минут ты будешь великолепно знать, что такое API и как создать свой собственный.Знакомая ситуация из реальной жизниПредставь, чт…

  • вторник, 11 ноября 2025 г. в 00:00:14