Hacker News Digest

Один HTML-файл содержит полностью интерактивный ASCII-город в киберпанк-стиле, который можно исследовать с клавиатуры. Проект создан энтузиастом под ником Grow Now! Games и использует только чистый HTML, CSS и JavaScript без внешних зависимостей или фреймворков. Город генерируется процедурно: здания, улицы, неоновые вывески и даже движущиеся поезда представлены символами ASCII, а их расположение и поведение определяются алгоритмами в скрипте. Пользователь перемещается стрелками или WASD, вид сбоку имитирует прогулку по улицам, а фоновая музыка и звуки усиливают атмосферу.

Код умещается в одном файле размером менее 100 КБ, что делает его удобным для загрузки и запуска в любом браузере. Автор подчеркивает, что цель — показать, насколько много можно достичь с минимальными средствами, вдохновлённый ретро-эстетикой и демосценой. В комментариях зрители отмечают детализацию: меняющееся время суток, динамические эффекты дождя и неона, а также скрытые пасхалки, например, терминалы с фейковым кодом. Проект стал популярным благодаря своей простоте и глубине, демонстрируя, как творческие ограничения могут порождать уникальные интерактивные опыты.

Обсуждение подтверждает работоспособность браузерного подхода к ASCII‐арту, но выявляет ряд ограничений: падение производительности при частой смене цветов, различие визуального качества между видео и реальным отображением, ограниченный доступ к полной версии проекта и сложность анализа кода из‐за WASM‐обфускации. Браузер предпочтительнее терминала для фикс‐ширинного ASCII‐арта благодаря точному контролю над шрифтами, пропорциями, вводом мыши и профилированием производительности. Среди методов отрисовки DOM‐текст даёт самую чистую картинку, но при частой смене цвета в каждой строке замедляется из‐за обёртывания символов в `<span>`. WebGL достигает более 1000 FPS и лучше подходит для динамических цветов. Для выбора метода рекомендуется бенчмаркинг DOM, Canvas и WebGL. Часть разработчиков считает браузер слишком тяжёлым для TUI и предпочитает терминал из‐за низкого потребления ресурсов и возможности SSH‐доступа к мощным серверам; другие рассматривают браузер как более гибкую и современную платформу. Реальное отображение в браузере нередко выглядит менее чётко, чем демонстрационное видео, что указывает на различия в рендеринге между браузерами. Для улучшения качества рекомендуется использовать блоковые символы (ASCII 219) в сочетании с половинными блоками и символами затенения (220, 223, 176–178) для дезеринга. Расширенный ASCII (символы выше 127) добавляет графических возможностей, но его поддержка зависит от шрифтов и окружения. Более продвинутая версия проекта находится за платным прототипом, а доступные ссылки ведут к старой версии, отличающейся от видео. Код проекта компилирован в WebAssembly и обфусцирован, что ограничивает прямой анализ, хотя некоторые пользователи пытаются его декомпилировать. Первая ссылка в посте ведёт к демо, вторая — к исходному коду, который может не соответствовать последним улучшениям. Движок города построен на сетке, использует лучевое трассирование каждый кадр для расчёта перспективы, глубины и коллизий и полностью реализован в одном HTML‐файле без внешних ресурсов. Проект вызывает ностальгию у любителей классических MUD и текстовых приключений, показывая, что чистый HTML способен обеспечить погружающий опыт без тяжёлых движков.

AI-сканеры создают постоянную нагрузку на git.kernel.org, потребляя около 20% вычислительных ресурсов — 14–16 из 90 ядер на пяти узлах постоянно тратятся на рендеринг коммитов в HTML для обучения моделей, что превышает нагрузку от всех легитимных запросов, включая git clone. Причина — неэффективный метод сбора данных: вместо простого клонирования репозиториев сканеры запрашивают каждый коммит как отдельную HTML-страницу, генерируя миллиарды дублирующих URL из-за форков и параметров вроде diff и patch, что создаёт «фоновое излучение» нагрузки. Хотя сайт остаётся отзывчивым для людей, основные сбои вызывают не сканеры, а плохо спроектированные CI-системы с поверхностными клонами. Администраторы пытаются бороться блокировкой IP и подсетей, но боты маскируются под браузеры и распределяются по облакам. В долгосрочной перспективе планируется ограничить функциональность и сократить количество сканируемых URL, хотя это ухудшит доступ для анонимных пользователей. Все данные останутся доступны для загрузки, но с дополнительными барьерами. Проблема системная: пока спрос на обучающие данные для LLM растёт, а простых решений нет.

Обсуждение дополняет статью: проблема не в технической неэффективности, а в системном провале этики веб-скрапинга. AI-скраперы игнорируют robots.txt и rate limiting, а защита через proof-of-work вредит легитимным пользователям, не останавливая продвинутых ботов. Советы по противодействию: - Замена Anubis на кастомную хеш-функцию без публикации обходит ASIC-скраперы, заточенные под стандартную реализацию. - Отказ от публичного HTML-интерфейса в пользу git clone для всех и веб-интерфейса только для авторизованных пользователей. - Лимит неавторизованных запросов — 5 в минуту с разрешением высокой частоты для авторизованных. - Рендеринг HTML на клиенте через JS-клиент, который клонирует репозиторий в браузере и кэширует данные. - Ловушки (бесконечные пути, медленная передача изображений, генерация абсурдного контента) заставляют ботов тратить ресурсы впустую. - Whitelist по IP/ASN вместо blacklist с общим списком между сайтами (риск: рынок поддельных доверенных узлов). - Повышение стоимости доступа к старым коммитам относительно новых — легитимные пользователи редко запрашивают древние данные. - Превращение proof-of-work в добровольный майнинг криптовалюты, где боты «платят» хостингом. - Временное повышение сложности Anubis при запросах к нестандартным URL с подсказкой посетить главную страницу. - Кэширование HTML-рендеров git-репозиториев, так как коммиты редко меняются. - Блокировка cgit-эндпоинтов (diffs, blame, snapshots) и возврат 402 за доступ — признание поражения, но единственный рабочий способ остановить ботов без отключения сервиса. Споры: - Anubis неэффективен: скраперы обходят его через куки, а мобильные пользователи страдают от высокой сложности. - AI-скраперы тратят ресурсы на обучение, но это не оправдание — они могли бы клонировать репозитории, а не запрашивать каждый коммит в HTML. Консенсус: - Современные AI-скраперы игнорируют robots.txt, rate limiting и другие устоявшиеся практики, делая традиционные методы защиты бесполезными. - Рост нагрузки от ботов не связан с качеством контента: скраперы сканируют всё подряд без фильтрации, создавая комбинаторный взрыв URL.

Decker — это платформа для создания интерактивных мультимедийных документов, вдохновлённая HyperCard и визуальной эстетикой классического macOS. Она сочетает простоту и доступность старых инструментов с современными удобствами: глубокой историей отмен, поддержкой сенсорных экранов, масштабируемыми операциями и полноценным скриптованием. Пользователи могут создавать электронные журналы, презентации, текстовые приключения, пиксель-арт или просто экспериментировать — всё сохраняется в самодостаточных HTML-файлах, которые работают в браузере и совместимы с Git. Деки — это не просто документы, а наборы переиспользуемых компонентов, которые легко копировать и адаптировать.

Для сложной логики используется язык Lil — лёгкий, похожий на Lua и Q, с неожиданными удобствами: неявной арифметикой векторов, встроенным SQL-подобным запросом и минимальной кривой обучения. Lil работает и вне Decker через Lilt — автономный интерпретатор, который можно скомпилировать в один исполняемый файл и запустить даже в AWK. Все файлы хранятся в текстовом формате, что делает их идеальными для версионного контроля. Decker лишён рекламы, телеметрии и навязчивых функций — он создан для творчества, а не для монетизации. Среди примеров — Sokoban, Breakout, CHIP-8-интерпретатор и библиотеки для анимации, звука, графиков и визуальных новелл. Платформа открыта под MIT-лицензией, с активным сообществом и ежегодными джемами.

Пользователи отмечают простоту и доступность Decker и её предшественника HyperCard, подчёркивая их потенциал для создания интерактивных мультимедийных документов, презентаций, электронных журналов, игр и образовательных программ. HyperCard использовался для множества инновационных приложений. Некоторые считают Decker устаревшим, другие — потенциально полезным для новых решений, включая сенсорные устройства и образовательный/развлекательный контент. Рекомендуют улучшить дизайн и добавить поддержку сети.

Bento/Slides — это презентация, которая сама является программой: всё — редактор, просмотр и слайды — упаковано в один HTML-файл. Нет необходимости в установке, аккаунте или серверах: файл открывается в браузере, автоматически сохраняется при нажатии Ctrl+S, и включает встроенные изображения, шрифты и данные в виде JSON. Он работает офлайн, не требует обновлений и остаётся вашим навсегда — никаких лицензий или истечения срока.

Функционал впечатляет: анимации морфинга плавно преобразуют элементы между слайдами — даже градиенты и формы. Диаграммы живые: можно наводить на столбцы, масштабировать данные колесом мыши или переключать их вид (столбцы → круговая → рассеянная) без перезагрузки. Таблицы с данными мгновенно обновляют графики при редактировании. Форматирование текста работает мгновенно — списки, код и зачёркнутый текст появляются при наборе. Нажатие Esc превращает любой слайд в редактор — вы сразу получаете полный контроль над содержимым.

Bento — перспективный инструмент для создания презентаций, способный заменить PowerPoint, особенно для простых задач. Пользователи ценят его офлайн-работу и независимость от облачных сервисов. Однако отмечаются ограничения: отсутствие поддержки некоторых форматов, ограниченная настройка, проблемы с производительностью при работе с большими презентациями и доступностью. Для сложных проектов рекомендуются Reveal.js или Slidev.

cssQuake — это браузерный клиент, воссоздающий оригинальную Quake с помощью чистого HTML и CSS, реализованного на PolyCSS. Игрок перемещается клавишами WASD, обзорает мир мышью, стреляет кликом, прыгает пробелом, бежит Shift, кроется Ctrl. Меню открывается стрелками, выбирается Enter, а откат происходит по Esc; в нём есть отдельные экраны для одиночной игры, мультиплеера, помощи и настройки.

Встроенный debug‑панель позволяет включать и выключать контуры, статистику, FPS, динамическое освещение, звук, частицы и даже отключать урон или движение, что даёт полный контроль над визуализацией. Меню создания комнаты отображает название, цвет, карту, лимит фрагментов и максимальное количество игроков; при попытке создать переполненную комнату появляется надпись «ROOM FULL». Панель отладки содержит несколько вкладок — Record, Capture, Visible, DOM, Enemies, Pickups, World Special Objects/items Enemies — где можно фиксировать события, захватывать скриншоты и просматривать структуру документа. Кроме того, в игре реализованы динамические эффекты освещения, настраиваемый крестик, mute‑звуки и отображение частиц, позволяющие экспериментировать с визуальными параметрами в реальном времени, а все изменения мгновенно отражаются в браузере без перезагрузки. Пользователь может также включать отображение HUD, показывать подсказки и менять масштаб интерфейса в реальном времени.

• Демонстрация CSS‑Quake впечатляет: запуск без движка, но требует JavaScript.
• Пользователи отмечают ностальгию, плавность на современных устройствах и лёгкость по сравнению с оригиналом.
• Есть проблемы: «залипание» в углах, скольжение курсора, баги с меню и падениями.
• Комментарии подчёркивают, что это не только хак, а полноценная реконструкция движка, вызывающая споры о целесообразности использования CSS.

Механические часы хранят энергию в тонкой спиральной пружине, помещённой в металлический барель, и передают её вращение через Arbor к шестерёнкам, которые движут стрелки. Эта пружина работает по принципу крутящего момента: при натяжении она хранит энергию, а при отпускании постепенно отдаёт её, вращая барабан. Внутри движения присутствует семь основных элементов, а ключевой – мэйнспринг, который в бареле хранит запас энергии, а металлическая лента, прикреплённая к пружине, создаёт трение, удерживая её от перемотки.

Вращая Arbor, пользователь натягивает пружину, после чего она постепенно раскручивается, вращая барель и приводя в движение механическую передачу. Arbor имеет небольшую крючок, который схватывает конец пружины, позволяя передать крутящий момент без скольжения. Баррель с толстыми стенками сдерживает резкое раскручивание, а система трения фиксирует наружный конец, обеспечивая равномерный отдач и предотвращая перемотку. Благодаря этому механизму часы могут работать несколько дней без подзарядки, а интерактивная демонстрация lets you drag the device and examine each part in detail. Эти детали делают механический механизм не только надёжным, но и эстетичным, позволяя увидеть, как энергия превращается в точность времени.

• Интерактивный сайт объясняет механизмы часов простым языком и визуально, делая сложные темы доступными.
• Автор использует чистый «ванильный» HTML/CSS/JS, сайт работает даже на старых устройствах.
• Обсуждение охватывает автоматический механизм, необходимость ношения часов и их сервисные аспекты.
• Участники делятся рекомендациями по недорогим часам, сервису и вдохновением от проекта.

Чтобы ускорить процесс получения услуг у регулируемой монополии, где падение удовлетворённости ниже 96 % грозит миллионами штрафов, команда решила заменить устаревший ASP‑форму и дорогой React‑приложение на полностью HTML‑ориентированный сайт. Используя Astro, они построили сайт, где каждая стадия формы — отдельная страница, отправляемая на сервер, а данные сохраняются в базе. Такой подход позволил работать без JavaScript, поддерживать древние браузеры и сохранять ввод даже при плохом соединении. Результат — количество пользователей мгновенно удвоилось.

Ключевой принцип — «простое HTML работает везде». Как отмечает Теренс Эден, даже браузеры типа PSP, способные открыть лишь три вкладки и часто терять память, без проблем отображают страницы GOV.UK, написанные в лёгком HTML. Команда использовала кастомные веб‑компоненты, которые перехватывают стандартную валидацию браузера, выводят ошибки в aria‑describedby и очищают их при вводе, избегая тяжёлых React‑валидаторов. Доступность достигла уровня AA, а всё приложение оставалось лёгким: без 20 МБ JavaScript‑пакетов, только небольшие улучшения в виде CSS и минимального скрипта. Это показывает, что для публичных форм достаточно чистого HTML и грамотного серверного хранения, а современные фреймворки лишь дополняют, а не заменяют базовый веб‑технологический фундамент.

• Простой HTML‑first подход с минимальным JavaScript может значительно повысить доступность и производительность сайтов.
• Использование технологий вроде HTMX и серверных фреймворков (Go, Rails, Django) позволяет реализовать сложные функции без тяжёлых клиентских библиотек.
• Проблемы с поддержкой старых браузеров и устройств часто решаются через полифиллы, ограничение функционала и fallback‑варианты.
• Успешные кейсы показывают, что правильный дизайн и понимание пользователей важнее выбора конкретного фреймворка.

В статье утверждается, что JavaScript-библиотеки для выбора даты, такие как Pikaday, часто не нужны и могут приводить к ошибкам и брошенным формам. Вместо этого рекомендуется использовать нативные HTML-инпуты: date для дат, time для времени и datetime-local для их комбинации. Эти решения требуют всего одной строки кода, обеспечивают лучшую доступность, производительность и интернационализацию, работают без JavaScript и позволяют браузеру обрабатывать сложные детали.

В качестве альтернатив предлагаются раздельные инпуты для дня, месяца и года (особенно полезно для запоминающихся дат), селекты при ограниченном наборе вариантов и маскированные инпуты с плейсхолдерами. Для улучшения опыта можно использовать атрибуты: inputmode="numeric" для отображения цифровой клавиатуры, maxlength для ограничения ввода, pattern для валидации, autocomplete для автозаполнения и min/max для ограничений диапазона. Автор подчеркивает важность прогрессивного усиления и учета пользователей без JavaScript.

• Пользователи жалуются на нативные пикеры из-за необходимости тысяч кликов, чтобы выбрать дату рождения, и наоборот — кастомные пикеры не позволяют вводить дату текстом.
• Разработчики отвечают, что нативный <input type="date"> не поддерживает форматов вроде «MM/DD/YYYY» и не даёт контроля над UI, а кастомные пикеры не решают проблему с доступностью и не имеют единого UX.
• В итоге спор сводится к тому, что нативный пикер не решает проблему, а кастомный — не решает её лучше.
• Пользователи также жалуются на то, что нативный пикер не позволяет вводить дату текстом, а кастомный — не позволяет вводить дату текстом.
• В итоге, обсуждение сводится к тому, что нативный пикер не решает проблему, а кастомный — не решает её лучше.

Marko — это декларативный язык на основе HTML для создания динамических веб-интерфейсов, расширяющий стандартный HTML возможностями для современных приложений. Любой валидный HTML является корректным Marko, но язык добавляет декларативные конструкции для реактивности и интерактивности, позволяя встраивать JavaScript прямо в шаблоны. Ключевые особенности включают потоковую передачу контента для ускорения первого отрисовки, оптимизирующий компилятор и минимальный рантайм, что обеспечивает высокую производительность даже для высоконагруженных проектов вроде eBay.com.

Фреймворк предлагает гибкость синтаксиса — от привычного HTML до более лаконичных вариантов Concise и JS — и поддерживает TypeScript для строгой типизации. Marko обеспечивает разделение concerns, управляемые компоненты, вложенную реактивность и неизменяемое состояние, что упрощает разработку масштабируемых приложений. Интеграция с экосистемой включает file-based routing и возможность использования как простых шаблонов, так и мощных компонентов по мере роста проекта.

• Обсуждение вращается вокруг того, что веб-разработка циклически возвращается к идеям, похожим на ColdFusion и JSP, и это вызывает у участников разговора разные чувства от ностальгии до раздражения.
• Участники обсуждают, что такое "HTML-основнный" язык, и как он отличается от JSX и других подходов, и почему мы снова и снова возвращаемся к этой идее.
• Обсуждение затрагивает вопрос о том, что некоторые считают, что эволюция веб-технологий просто движется по спирали, где старые идеи периодически перерабатываются и выдаются как новые.
• Участники также обсуждают, что такое "нативный" веб-разработка и как она отличается от подхода, где JavaScript используется для обработки событий и взаимодействия.
• Участники также обсуждают, что такое "нативный" веб-разработка и как она отличается от подхода, где JavaScript используется для обработки событий и взаимодействия.

Проект "How Did I Get Here" от Hack Club демонстрирует путь, который пакеты данных проходят от вашего устройства до сервера. С помощью самописного трейсера ktr, работающего по протоколу ICMP с использованием поля TTL, проект в реальном времени отслеживает каждый узел маршрута. Интересно, что сайт работает даже без JavaScript — сервер последовательно отправляет обновленную HTML-разметку, создавая иллюзию плавной загрузки трейсера.

Важно отметить, что показанный маршрут является "обратным" — от сервера к вашему устройству, а не наоборот, что может незначительно отличаться от реального пути из-за асимметрии маршрутизации. Каждый "сеть" в маршруте на самом деле представляет собой автономную систему (AS) — коллекцию маршрутизаторов, принадлежащую одной компании. Статья вскрывает, что интернет — это не свободная сеть, а скорее совокупность корпоративных сетей, связанных финансовыми соглашениями и бюрократическими процедурами.

• Обсуждение охватывает различные аспекты traceroute и его ограничений, включая то, что AS-путь может быть нестабилен, а фактические точки пиринга могут сильно различаться.
• Участники обсуждают, что traceroute может не отображать обратный путь, особенно если сеть использует асимметричное маршрутизирование.
• Обсуждается, что веб-сайт может не работать из-за блокировки ICMP или из-за того, что маршрутизаторы не отвечают на ICMP запросы.
• Участники также обсуждают, что traceroute может не отображать правильный путь, если используются различные стратегии маршрутизации, такие как source routing или loose source routing.
• Участники также обсуждают, что traceroute может не отображать правильный путь, если используются различные стратегии маршрутизации, такие как source routing или loose source routing.

Разработчик создал простое приложение для обучения детей инвестициям, так как школы не учат финансовой грамотности. Приложение представляет собой один HTML-файл, который работает как PWA (Progressive Web App) и устанавливается на старый смартфон, прикрепленный к холодильнику. Это позволяет детям визуально видеть, как их капитал растет день ото дня, с отображением ежедневного, недельного и месячного дохода, а также общего баланса. В качестве инвестиционного агента разработчик устанавливает реалистичные процентные ставки — достаточно высокие для мотивации, но умеренные, чтобы отражать реальные условия рынка.

Для создания проекта потребовался лишь старый смартфон, держатель для крепления к холодильнику и сам HTML-файл приложения. Цель заключалась не просто в обучении ценности денег, а в визуальном демонстрации того, как инвестиции и время работают вместе. Каждый день наблюдая за ростом своего небольшого фонда, дети постигают магию сложного процента — урок, который, как надеется автор, останется с ними на всю жизнь. Приложение доступно по ссылке и устанавливается так же просто, как нативное приложение.

• Обсуждение охватывает широкий спектр тем: от критики образовательных приложений до обсуждения финансовой грамотности и инвестиций в целом.
• Участники обсуждения подчеркивают, что финансовая грамотность и инвестиции важны, но критикуют подход, который фокусируется на инвестициях вместо общего финансового образования.
• Обсуждается, что обучение детей инвестировать может быть преждевременным и не учитывает важные аспекты, такие как риск, налоги и волатильность рынка.
• Участники также поднимают вопрос о том, что приложения, которые обучают инвестициям, могут быть использованы для манипуляции детьми и не учитывают реальные финансовые обстоятельства большинства людей.

Статья напоминает о четырех важных HTML-тегах, которые стоит включать для корректной работы веб-страниц. Без <!doctype html> браузеры могут переключиться в quirks mode, имитируя устаревшее поведение. Указание языка через <html lang="en"> помогает поисковикам и скринридерам правильно интерпретировать контент. Тег <meta charset="utf-8"> гарантирует корректное отображение специальных символов, таких как кавычки, эмодзи и нелатинские символы. Наконец, <meta name="viewport"> необходим для адаптивного дизайна, предотвращая крошечный текст на мобильных устройствах.

Эти простые теги решают распространенные проблемы с отображением и функциональностью веб-страниц. Автор подчеркивает, что даже при работе с локальными файлами без сервера эти элементы критически важны для корректного рендеринга. Особенно заметна разница при отсутствии тега viewport на мобильных устройствах или charset при отображении специальных символов, которые превращаются в непонятные значки без правильной кодировки.

• Обсуждение затронуло тему минимализма в веб-разработке: отсутствие бандлов, использование Lit Elements без TypeScript и отсутствие сборщиков.
• Участники обсуждали, что HTML5 позволяет опускать закрывающие теги и некоторые атрибуты, что может влиять на читаемость кода.
• Были упомянуты такие практики, как неиспользование сборщиков и бандлов, что может быть связано с философией "no-build".
• Обсуждались также такие темы, как использование сторонних библиотек и фреймворков вместо "ванильного" JavaScript и CSS, и как это влияет на производительность и размер страницы.
• Участники также затронули тему "легковесных" решений и их влияние на производительность и удобство использования.

Предоставленный текст содержит только навигационную структуру сайта MDN, но не основное содержание статьи о методе setHTML(). В тексте отсутствует описание самого API, его синтаксиса, параметров, примеров использования и совместимости с браузерами. Для создания точного пересказа требуется полное содержание статьи, описывающее новый метод DOM API, который, вероятно, предоставляет альтернативу innerHTML с дополнительными возможностями или улучшенной безопасностью. Без доступа к фактическому описанию метода невозможно предоставить содержательный пересказ его функциональности и применения.

• Впервые за 25 лет в Firefox Nightly появилась возможность безопасно вставлять HTML через Element.setHTML(), что вызвало обсуждение: спор о том, почему так долго не хватало базовой возможности, и о том, что API-шный дизайн (включая именование setHTML/setHTMLUnsafe) не идеален.
• Участники обсуждения отметили, что новое API встроенной санитизации встроенной в браузер — это фактически встроенный DOMPurify, и что спор в основном ведется о том, что «безопасность по умолчанию» должна быть выбрана как поведение по умолчанию.
• Некоторые комментаторы выразили обеспокоенность тем, что спецификация пока не различает между контентом и вставляемым через setHTML() и innerHTML, и что это может влиять на производительность, если разработчики начнутт читать спецификацию как «естественное продолжение» innerHTML.
• Были также затронуты темы о том, что встроенная санитизация может влиять на разработчиков, которые полагаются на встроенную санитизацию, и о том, что это может влиять на разработчиков, которые полагаются на встроенную санитизацию.

HTML-тег <output> почти не используют, но он решает две задачи: делает результат вычислений доступным для скринридеров и избавляет от необходимости вручную подключать ARIA live-регионы. Пример: калькулятор, слайдеры, индикаторы сложности пароля. Тег работает без JavaScript и ARIA-атрибутов, поддерживается всеми браузерами и скринридерами.

• <output> оказался почти неиспользуемым тегом, и его поддержка в браузерах и скринридерах фрагментарна, что делает его практически бесполезным.
• Попытки использовать <output> для отображения результатов вычислений сталкиваются с тем, что большинство фронтенд-разработчиков не знают о существовании тега, а спецификация вводит в заблуждение, что тег сам обновляет свое содержимое.
• Практика показывает, что вместо <output> используются другие теги, и это вызывает вопрос, почему вообще нужен этот тег, если он не работает как задумано.
• Поднимается вопрос о том, что если тег не работает как задумано, то возможно стоит пересмотреть спецификацию или полностью отказаться от тега в пользу более надежных решений.

Datastar — это «гипермедийный» фреймворк, который позволяет строить реактивные веб-приложения без JavaScript-кода. Он использует HTML-атрибуты и SSE-потоки для связи с сервером, а не JSON-API. Библиотека весит всего 10,75 КиБ и не требует сборки, что делает её идеальной для быстрого прототипирования. Примеры включают в себя чат-приложение, доска Kanban и т.д.

• Datastar и его автор Делани Гиллиан продвигают идею минималистичного подхода к веб-разработке, но критики указывают на то, что это может быть маркетинговым ходом, поскольку Pro-версия платная, а также что фреймворк может быть переоценённым решением, которое не решает фундаментальные проблемы веб-разработки.
• Обсуждение выявило, что Datastar не предоставляет никаких новых решений для проблем, с которыми сталкиваются разработчики, и вместо этого фокусируется на уже известных проблемах, таких как сложность, с которой сталкиваются разработчики, и не предлагает никаких новых решений.
• Участники обсуждения также подняли вопрос о том, что Datastar может быть не более чем просто ещё одним инструментом в арсенале веб-разработчика, и что его ценность может быть переоценена, в то время как другие инструменты, такие как HTMX и Alpine.js, могут предложить схожий функционал без необходимости платить за Pro-версию.
• Некоторые участники обсуждения также выразили обеспокоенность тем, что Datastar может быть не более чем попыткой монетизировать open-source проект, и что это может быть неэтичным, особенно если это не делает ясным, какие именно функции являются Pro-версией эксклюзивными.
• В конце концов, обсуждение подошло к выводу, что хотя Datastar и может быть полезным инструментом в определённых контекстах, его ценность может быть переоценена, и что его подход может не подходить для всех.

Минимальный CSS для приятного сайта включает базовые стили, улучшающие типографику и читаемость. Начните с ограничения ширины медиа-контента: img, svg, video { max-width: 100%; display: block; } предотвращает переполнение. Для типографики используйте system-ui как безопасный шрифт, увеличьте размер до 1.25rem и установите line-height в 1.5 для лучшей читаемости.

Добавьте поддержку тёмной темы через html { color-scheme: light dark; }, но учтите, что пользователям может потребоваться ручное переключение. Ограничьте ширину основного контента с помощью main { max-width: min(70ch, 100% - 4rem); margin-inline: auto; } для оптимальной длины строки в 45–90 символов. Этот подход избегает избыточного кода и обеспечивает адаптивность.

• Обсуждаются минималистичные подходы к CSS, включая сброс стилей, базовые настройки для типографики и ограничения ширины контента для улучшения читаемости.
• Поднимается вопрос о реализации темной темы, важности ручного переключения пользователем и проблемах с "миганием" при загрузке.
• Критикуются стандартные системные шрифты и обсуждаются потенциальные проблемы с их отображением в разных ОС и локалях.
• Упоминаются различные инструменты и философии (например, SSG, Tailwind, Every-Layout) для создания простых и эффективных сайтов.
• Высказывается мнение, что пользователь должен иметь максимальный контроль над стилизацией контента, а не сайт.

Это браузерная игра «Змейка», которая использует URL-страницы в качестве игрового поля. Управление осуществляется стрелками или клавишами WASD, а змейка перемещается прямо в адресной строке. Если URL отображается некорректно, есть кнопка для исправления отображения.

Игра сохраняет рекорд игрока в очках и позволяет делиться результатом. Создана разработчиком под ником @epidemian, исходный код открыт на GitHub. Проект демонстрирует креативный подход к использованию стандартных элементов браузера для создания игрового процесса.

• Пользователи восхищены креативностью и нестандартным подходом к реализации игры "Змейка" в адресной строке браузера с использованием символов Unicode (Braille).
• Обсуждаются технические аспекты и проблемы: некорректное отображение пробелов в некоторых браузерах, предложения по улучшению (использование других символов, зацикливание границ), ограниченная работа на мобильных устройствах.
• Предупреждения о возможных проблемах с историей браузера и рекомендации использовать режим инкогнито.
• Упоминаются похожие проекты: игры в favicon (2048, другая версия "Змейки"), а также шуточные предложения портировать Doom.
• Автор проекта (@epidemian) отмечает, что игра создана 10 лет назад и может некорректно работать в современных браузерах.

• Реклама в интернете — зло: тратит время и уродует сайты.
• Поддержи автора напрямую: 1 $ приносит больше пользы, чем тысячи показов баннеров.
• На сайте выводится тонкое сообщение: «Adblock не обнаружен. Поставь uBlock Origin — сэкономишь трафик и нервы».
• Блок скрывается кнопкой «Закрыть» и больше не появляется (cookie notice-shown).
• Техника:
  – в HTML встроен <div> с «адоподобными» классами и скрипт nativeads.js;
  – если div вырезан или скрипт заблокирован, сообщение не видно;
  – стили показывают блок только при ≥75 em ширины и ≥30 em высоты;
  – без JS сообщение не вставляется, без CSS просто не стилизуется.
• DNS-блокировку не отследить, поэтому банер маленький и некликабелен вне основного контента.

• Без блокировщиков рекламы веб выглядит как «лабиринт трекеров и баннеров»: большинство пользователей живут в этом каждый день.
• uBlock Origin называют едва ли не «лучшим антивирусом»; ФБР и CERN рекомендуют блокировщики как защиту от скама и малвари.
• Даже с адблоком сайты всё чаще «раскрывают» посетителей через identity-graph (IP, хэши устройств) и потом спамят e-mail.
• Часть участников считает блокировку «паразитизмом»: контент бесплатен только потому, что кто-то смотрит рекламу.
• Другие возражают: договор «контент ↔ реклама» давно нарушен — автозвук, трекинг, монополии Google/Meta, потребление трафика и батареи.
• Альтернатива — платить авторам напрямую, но пожертвования от 0,01 % читателей не покрывают хостинг, уж не говоря о зарплате.

Репозиторий Evidlo/xsl-website
Публичный пример генерации сайта средствами XSLT: XML-документ преобразуется в полноценную HTML-страницу без серверной логики.

Ключевые файлы

• index.xml – исходные данные
• index.xsl – таблица стилей
• README.md – краткое руководство

Запуск

1. Откройте index.xml в браузере или
2. Примените XSLT-процессор: xsltproc index.xsl index.xml > index.html

Репозиторий демонстрирует, как обойтись без движков шаблонов, используя лишь стандартные XML-технологии.

• Обсуждение началось с демонстрации, как SGML/XML-entity можно использовать для «без-JS» сборки страниц, но напомнили, что браузеры никогда не реализовали полноценный SGML-парсер.
• Участники сравнили XSLT и CSS: CSS может вставлять контент, но лишь декоративно, тогда как XSLT позволяет полноценные преобразования, однако Google просит удалить XSLT из стандарта и уже прячет его за флагом в Chrome.
• Всплыли воспоминания о 2000-х, когда XML/XSLT активно применялись для документации, e-learning и CMS (Symphony), но сложность и отсутствие поддержки со стороны браузеров постепенно вытеснили технологию.
• Предложили альтернативы: серверная трансформация (PHP, CI/CD) или полный отказ в пользу современных сборщиков и SSR-фреймворков.

Hyperclay — однофайловые HTML-приложения
Работайте как с глиной: открыли файл, изменили — изменения сохранились. Без сборки, деплоя и фреймворков.

• Прямое редактирование в браузере: меняете DOM — файл перезаписывает себя через /save.
• Полная переносимость: скачали HTML — запустили где угодно, офлайн.
• Версии: каждое сохранение фиксируется, откат в один клик.

Примеры: dev-log, writer, kanban, landing.

Почему это важно

Статические сайты удобны, но изменения исчезают после перезагрузки. Чтобы сделать цифровой объект «физическим» — нужен сервер, БД, API, аккаунты. Hyperclay убирает всё лишнее: UI, логика и данные — в одном самомодифицирующемся HTML-документе.

• Hyperclay — это NodeJS-сервер + клиентская библиотека, которая сохраняет изменения DOM прямо в исходный .html-файл, обновляя его на лету.
• Идея вызывает ассоциации с TiddlyWiki, Webstrates и даже HTA-архивами Windows 98, но делает акцент на многопользовательской работе и версионировании.
• Участники обсуждают проблемы локального file:// (CORS, модули), безопасность, ограничения iOS и то, что без сервера изменения не сохраняются.
• Некоторые делятся своими однофайловыми решениями: шифровальщик, Asteroids, «твиттер» на git-коммитах и т.д.
• Сообщество просит открытый код, нормальную документацию и понятную схему версионирования/обновления приложений.

• CSS

  • min-width: auto (по умолчанию) имеет приоритет над flex-shrink, overflow: hidden, width: 0; задайте min-width: 0.
  • Горизонталь и вертикаль различаются: width: auto растягивается, height: auto по содержимому; margin: 0 auto центрирует по горизонтали, но не по вертикали (в flex-direction: column работает).
  • BFC (display: flow-root) предотвращает схлопывание margin и «обнуление» высоты родителя с float-потомками.
  • Новый stacking context создают transform, filter, opacity, position: fixed/sticky, z-index + absolute/relative и др.; z-index действует только внутри контекста.
  • На мобильных 100vh включает скрытые панели; используйте 100dvh.
  • position: absolute ориентируется на ближайший «positioned» ancestor, а не на родителя.
  • float не работает внутри flex/grid-родителя.
  • Процентные width/height не работают, если размер родителя не задан.
  • display: inline игнорирует width, height, вертикальные margin.
  • Пробелы между inline-block элементами рендерятся; в flex/grid — нет.
  • box-sizing: content-box (по умолчанию) не включает padding/border; включите border-box.
  • Указывайте width/height у <img> для предотвращения CLS.
  • Загрузка файлов не показывается в DevTools; используйте chrome://net-export/.
  • Внутри <script> строка </script> ломает парсинг.

• Unicode

  • Отличайте code point и grapheme cluster (последнее — то, что видит пользователь).

• Маршрутизаторы могут тихо обрывать простаивающие TCP-соединения; настройте TCP-keepalive или HTTP-заголовки.
• Возвращать null из Optional<T> — антипаттерн; Kotlin и аннотации уже решают это.
• UTF-16 в Java/C#/JS — деталь реализации; в Go строки — просто байты.
• min-width: auto работает не везде; CSS-свойства нельзя читать изолированно.
• Регексы, YAML, LF/CRLF, rm -rf $DIR/ — каждый язык/платформа имеет свои подводные камни.

Чар простой текстовой страницы

Открывая страницу из одного текста, я чувствую облегчение: нет баннеров куки, рекламы, всплывающих подписок и автозапуска видео.
Только чистый, быстрый, читаемый текст.

Такой контент можно скопировать в письмо, отправить в ChatGPT, распечатать или сохранить на Kindle — он везде работает.
Ссылка открывается мгновенно без CDN и предзагрузок.
Хостинг стоит копейки, сайт живёт даже на Raspberry Pi.

Читая, легко переключаться между беглым просмотром и вдумчивым чтением, не чувствуя вины за «потерянное» время.

Спасибо всем, кто публикует текст без лишнего.
Вы жертвуете «вовлечённостью», но дарите интернету простоту и покой.
Мне это безумно нравится.

• Участники мечтают о браузере без JS, где только HTML и выбранная пользователем CSS-тема.
• Хвалят сайты вроде plaintextsports.com и berkshirehathaway.com за минимализм, читаемость и отсутствие трекеров.
• Спорят о шрифтах: кто-то любит моноширинные «под печатную машинку», кто-то просит sans-serif и контрастные цвета.
• Соглашаются, что картинки допустимы, если служат тексту, а главный враг — избыточный JS, баннеры и медленные фреймворки.
• Вспоминают лёгкие новостные «lite»-версии CNN/NPR и альтернативные протоколы вроде Gemini как примеры «текстового» интернета.

Современные ИИ-чаты умеют отвечать на сложные вопросы, потому что мы так и не научились структурировать информацию. Пример: «Какое животное изображено на флаге страны, где первая британская колония появилась в год, когда Швеция объявила войну Франции?» — ChatGPT за секунды выдал «попугай сиссеро на флаге Доминики, колония 1805 г.», а Google AI-виджет провалился.

Такой «поисковый» паттерн повсюду: Google Drive — облачная папка, которую легче искать, чем упорядочивать; сайты вместо структуры набиты ключевыми словами; документацию заменяют чат-боты.

Семантический веб, где данные должны были быть машиночитаемыми и связанными, так и не случился: вместо структурированного HTML — динамические div-ы без метаданных. Личные компьютеры не стали персональными базами знаний с семантическими связями, как мечтал ХайперКард.

Если бы знания хранились структурированно, ответ нашёл бы простой алгоритм без миллиардов параметров. ИИ — не триумф элегантного дизайна, а грубое решение: он выстраивает мимолётную семантику из хаоса, но само знание остаётся недоступным и непрозрачным.

• Участники сравнивают идею «всё структурировать» с утопией «если бы все просто были хорошими людьми» – красивая теория, но нереалистична.
• Напоминают, что Semantic Web, Knowledge Graph и Cyc пытались кодировать знания вручную, но масштабировались плохо: люди не умеют быстро и точно описывать мир.
• Отмечают, что современные ИИ-модели стали «пластырем», который сам строит семантические связи из хаотичных данных, хотя и с ошибками.
• Подчёркивают: поисковики и LLM дополняют друг друга; ни один не решает всё, но вместе дают результат.
• Главный вывод: неудача не в «плохих людях», а в сложности мира и в том, что рутинная работа по разметке никому не принадлежит и никем не финансируется.