The OpenNET Project / Index page

[ новости /+++ | форум | теги | ]

Реализация игры DOOM, использующая для отрисовки только CSS

28.03.2026 13:16 (MSK)

Представлен проект cssDOOM, подготовивший реализацию игры DOOM, использующую для отрисовки только CSS, без применения элемента canvas и WebGL. Всё что выводится на экран, включая спрайты, текстурированные стены, уровни и эффекты, оформлено через стилизованные при помощи CSS элементы <div>, размещаемые в 3D-пространстве при помощи CSS-свойств "transform" и"transform-style: preserve-3d". Игровая логика написана на JavaScript, используя в качестве эталона оригинальный код игры DOOM, открытый компанией id Software. Наработки проекта опубликованы под лицензией GPLv2.





  1. Главная ссылка к новости (https://nielsleenheer.com/arti...)
  2. OpenNews: Варианты игры Doom для САПР KiCAD и осциллографа
  3. OpenNews: Выпуск проекта FPDoom 1.20251101, развивающего порты Doom и других игр для кнопочных телефонов
  4. OpenNews: Реализована многопользовательская DOOM-подобная игра, написанная на SQL
  5. OpenNews: Эксперимент по созданию искусственного интеллекта для игры в Doom
  6. OpenNews: Компания id Software открыла исходные тексты игры Doom 3 BFG
Автор новости: Джон Титор
Лицензия: CC BY 3.0
Короткая ссылка: https://opennet.ru/65090-doom
Ключевые слова: doom, css
При перепечатке указание ссылки на opennet.ru обязательно


Обсуждение (54) Ajax | 1 уровень | Линейный | +/- | Раскрыть всё | RSS
  • 1.1, Аноним (1), 13:20, 28/03/2026 [ответить] [﹢﹢﹢] [ · · · ]  
  • +3 +/
    Ну хоть на что-то современные стандарты годятся
     
     
  • 2.9, Аноним (9), 13:55, 28/03/2026 [^] [^^] [^^^] [ответить]  
  • +3 +/
    Да, современные стандарты настолько круты что могут запускать игру 1995, года)
     
  • 2.20, Аноним (20), 15:39, 28/03/2026 [^] [^^] [^^^] [ответить]  
  • +1 +/
    Вообще то CSS разрабатывался (потребляемые ресурсы) на статический просмотр (FPS не критично).
     
     
  • 3.33, Смузихлеб забывший пароль (?), 17:28, 28/03/2026 [^] [^^] [^^^] [ответить]  
  • +/
    мб когда-то. Но анимации туда уже давно завезли
     
  • 3.50, Аноним (50), 20:25, 28/03/2026 [^] [^^] [^^^] [ответить]  
  • +/
    Html5: да ладно?!
     

  • 1.3, Аноним (3), 13:22, 28/03/2026 [ответить] [﹢﹢﹢] [ · · · ]  
  • –2 +/
    Ну и жрёт этот монстр, относительно оригинала, поди будь здоров!
    Это вам не Doom на тесте беременности.
     
     
  • 2.31, Абырвалг (?), 17:20, 28/03/2026 [^] [^^] [^^^] [ответить]  
  • +3 +/
    на тесте беременности дума никогда не было, хватит эту байку распростронять
     
     
  • 3.47, zyeMnonozooyalg (?), 19:37, 28/03/2026 [^] [^^] [^^^] [ответить]  
  • –2 +/
    > на тесте беременности дума никогда не было, хватит эту байку распростронять

    Просто оставлю это здесь
    https://habr.com/ru/companies/pixonic/articles/518142/

     
     
  • 4.49, Аноним (49), 20:20, 28/03/2026 [^] [^^] [^^^] [ответить]  
  • +2 +/
    > Просто оставлю это здесь
    > https://habr.com/ru/companies/pixonic/articles/518142/

    Ссылку оставить осилил, а прочесть то, что по ней же написано — нет…

    > …Чтобы полноценно запустить игру, ему пришлось заменить дисплей и микроконтроллер. Оригинальный дисплей мог показывать только четыре возможных экрана, а центральный процессор нельзя было перепрограммировать

    Это мистификация, кликбейт для твиттора. В корпус от теста на беременность был помещён дисплей, на котором проигрывались видюшки.

     

  • 1.4, KALIBR10 (ok), 13:37, 28/03/2026 [ответить] [﹢﹢﹢] [ · · · ]  
  • –2 +/
    Мир танков бы тоже надо на CSS переписать, а то Wine обновляется а fps не увеличивается
     
  • 1.5, Скотобаза (?), 13:50, 28/03/2026 [ответить] [﹢﹢﹢] [ · · · ]  
  • +10 +/
    А помните когда то браузеры показывали сайты и не жрали терабайты памяти?
     
     
  • 2.7, Агл (?), 13:54, 28/03/2026 [^] [^^] [^^^] [ответить]  
  • +6 +/
    а для всякой фигни был флэш
     
     
  • 3.22, Аноним (22), 16:09, 28/03/2026 [^] [^^] [^^^] [ответить]  
  • –5 +/
    Флэш был слишком быстрый, потому его "убрали".
     
     
  • 4.41, Аноним (49), 19:12, 28/03/2026 [^] [^^] [^^^] [ответить]  
  • +1 +/
    Флэш был проприетарный и катастрофически дырявый, и именно поэтому его убрали.

    Кому надо быстро — в стандартах всё есть, осваивайте WebAssembly и WebGL. Можно Doom3 запускать в браузере ( https://github.com/gabrielcuvillier/d3wasm ).

     
     
  • 5.43, Тот_Самый_Анонимус_ (?), 19:26, 28/03/2026 [^] [^^] [^^^] [ответить]  
  • +1 +/
    Нет, его убрали по глупости. До сих пор в вебе нет нормальной векторной анимации, коей был флеш. И он был скоростнее того, что вы предложили.
     
     
  • 6.46, Аноним (49), 19:32, 28/03/2026 [^] [^^] [^^^] [ответить]  
  • –1 +/
    > …в вебе нет нормальной векторной анимации

    Здрасте, приехали. SVG же.

    Дуракопригодной удобной студии нет, это да, поэтому всерьёз заморачиваются только гики. Skill issue, чтоподелать.

     
     
  • 7.57, Cyd (?), 21:17, 28/03/2026 [^] [^^] [^^^] [ответить]  
  • +/
    Видимо, что уважаемый аноним не пробовал на svg чтото всерьез делать. кривое тормозное и в каждом браузере по разному поддерживаемое. а очень жаль. сам радел за svg.
     
  • 7.60, Тот_Самый_Анонимус_ (?), 22:46, 28/03/2026 [^] [^^] [^^^] [ответить]  
  • +/
    >Дуракопригодной удобной

    Это не синонимы. У вас ментальные проблемы.

    СВГ — это раздутый текстовый формат, не содержащий в себе анимации. Вы хоть бы понимать научились на что отвечаете.

    И да, гики уёво рисуют, а художникам нужен удобный инструмент.

     
     
  • 8.62, Аноним (49), 23:31, 28/03/2026 [^] [^^] [^^^] [ответить]  
  • +/
    Тормозно, раздуто 8212 это всё субъективщина Вы, наверное, запамятовали есл... большой текст свёрнут, показать
     
  • 5.61, Аноним (61), 23:00, 28/03/2026 [^] [^^] [^^^] [ответить]  
  • +/
    Дырявый? Да сколько сейчас фиксится в браузерах очередных дыреней в js движке, оптимизируется лагучая отрисовка стопитсотого CSS свойства и т.п., что было призвано сделать страницы более визуально привлекательными и интерактивными, и с чем флэш справлялся более чем.
    Проблема у флэша была одна - насквозь проприетарный, монополию на его разработку держала сначала макромедиа, затем адобе. Ещё одним из немало важных следствий закрытости - интеграция с браузерами через NPAPI. Ну и ближе к концу своего существования стал напоминать собаку на сене, и его начали тем или иным способом обходить стороной. Отдельное спасибо Джобсу, принявшему решение делать отдельное приложение для просмотра ютуб, в качестве ответа подсералова гуглу и медлительности адоба.
     
  • 2.8, Аноним (8), 13:55, 28/03/2026 [^] [^^] [^^^] [ответить]  
  • +2 +/
    Никогда такого не было. HTML + CSS + JS - это такой лютый набор костылей, кривых реализаций и отвратительных практик которые потом диктуют что ещё попадёт в "стандарт", что рендерить всё самому в canvas уже не кажется настолько бредовой идеей.
     
     
  • 3.12, Аноним (12), 14:46, 28/03/2026 [^] [^^] [^^^] [ответить]  
  • +/
    Какие существуют альтернативы (хотя бы малоиспользуемые)?
     
     
  • 4.23, Аноним (22), 16:11, 28/03/2026 [^] [^^] [^^^] [ответить]  
  • +/
    PDF. И он не сказать что "малоиспользуемые". Внутри pdf - PS, а это посерьёзней будет JS-а. В pdf есть всё: и формы, и интерактивность.  
     
     
  • 5.27, Аноним (12), 16:45, 28/03/2026 [^] [^^] [^^^] [ответить]  
  • +/
    Portable document format? Никогда не видел .pdf документа с формами и интерактивностью (без шуток), обычно это текст, изображения и (максимум) гиперссылки в оглавлении. Можно пример такого документа? Вы мне, похоже, Америку сейчас открываете?
     
     
  • 6.29, Аноним (29), 17:01, 28/03/2026 [^] [^^] [^^^] [ответить]  
  • +2 +/
    У нас оно не сильно распространено.
    А вот во всяких европах и штатах тебе могут принести планшет с пдфной формой, которую ты заполнишь, а потом подпишешь своей ЕЦП.

    А еще их любят всякие строители.
    Видел что при постройке ветряков у сименса, рабочие заполняют чеклисты проведенных проверок.

     
     
  • 7.32, Смузихлеб забывший пароль (?), 17:26, 28/03/2026 [^] [^^] [^^^] [ответить]  
  • +/
    у сименса и иное ПО до сих пор под ХР и всё равно местами глючное
     
  • 6.30, Аноним (30), 17:07, 28/03/2026 [^] [^^] [^^^] [ответить]  
  • +/
    Пожалуйста.
    Официальная форма на японскую визу: https://www.mofa.go.jp/files/000124525.pdf
     
  • 6.34, G0Dzilla (??), 17:34, 28/03/2026 [^] [^^] [^^^] [ответить]  
  • +/
    Основной интерактивный интерфейс дисков журнала "Мир ПК" был в PDF. Встроенный плеер, переходы, запуск инсталляторов и т.д.
     
  • 6.38, Аноним (22), 18:44, 28/03/2026 [^] [^^] [^^^] [ответить]  
  • +/
    > Никогда не видел .pdf документа с формами и интерактивностью

    Ну тогда советую хотя бы спеки полистать.

     
     
  • 7.51, Аноним (50), 20:28, 28/03/2026 [^] [^^] [^^^] [ответить]  
  • +/
    А что-нибудь менее эфемерное есть?
     
  • 6.45, Тот_Самый_Анонимус_ (?), 19:30, 28/03/2026 [^] [^^] [^^^] [ответить]  
  • +/
    >Можно пример такого документа?

    В начале тысячелетия был журнал «Мир ПК». На дисках, поставляемых с ним, в авторан был прописан пдф с ссылками на другие пдф-ки. Как хтмл, только пдф.

     
  • 3.37, Аноним (37), 18:36, 28/03/2026 [^] [^^] [^^^] [ответить]  
  • +/
    >HTML + CSS + JS - это такой лютый набор костылей

    Так стоп! В смысле костылей? Эта тройка основа современного вэба. Его фундамент. И по правде говоря он не создавался для игр. Хотя, кто знает каким путём пойдёт будущее.

     
     
  • 4.40, Ананоним (?), 19:06, 28/03/2026 [^] [^^] [^^^] [ответить]  
  • +/
    >>HTML + CSS + JS - это такой лютый набор костылей
    > Так стоп! В смысле костылей? Эта тройка основа современного вэба. Его фундамент. И по правде говоря он не создавался для игр. Хотя, кто знает каким путём пойдёт будущее.

    Ха! Это не основа, а суррогат десктопа, который по прихоти некоторых натянули на то, что ранее было вебом. Кривее и раздутее "технолигии" трудно найти.

     
  • 2.10, Аноним (9), 14:00, 28/03/2026 [^] [^^] [^^^] [ответить]  
  • –4 +/
    >А помните когда то браузеры показывали сайты и не жрали терабайты памяти

    Нет неправда, интернет нельзя было запустить на пк времен Woindows95/98.

    И как люди на таких пк с таким интернетом, с такими пк не могли проверять инфоормацию, узнавать что то новое.

     
  • 2.11, Аноним (11), 14:35, 28/03/2026 [^] [^^] [^^^] [ответить]  
  • –3 +/
    Обычно такое пишут молодые любители ностальгии, хоть они тот интернет и не видели в глаза. Зайди на архив, посмотри. Неземное наслаждение смотреть страницы с триллиардом баннеров-гифок, флеш-рекламой во всплывающих окнах и едущей вёрсткой.
     
     
  • 3.24, Аноним (22), 16:15, 28/03/2026 [^] [^^] [^^^] [ответить]  
  • +/
    То ли дело сейчас: страницы с триллиардом баннеров-на-JS-с-WebGL, video-тег-рекламой в плавающих div поверх содержимого, JS-вёрсткой, которая никогда нормально не работает и всё едет, плюс вебсокеты и аякс, конечно, чтобы быстро не могло в теории даже работать.
     
     
  • 4.36, Аноним (36), 18:35, 28/03/2026 [^] [^^] [^^^] [ответить]  
  • +/
    Не видел такого ни на одной веб-странице. Но у меня и глаза не очень большие.
     
  • 2.35, Аноним (36), 18:33, 28/03/2026 [^] [^^] [^^^] [ответить]  
  • +/
    Линукс снова сожрал терабайт памяти. Это уже нездоровая тенденция. Попячьтесь!
     

  • 1.6, Аноним (8), 13:52, 28/03/2026 [ответить] [﹢﹢﹢] [ · · · ]  
  • +/
    В CSS можно как-то повторить поведение details на любом другом тэге? Пихать жабоскрипт ради простого сворачивания кнопки или везде в details всё оборачивать чё-то как-то кринж.
     
     
  • 2.44, Аноним (49), 19:26, 28/03/2026 [^] [^^] [^^^] [ответить]  
  • +/
    Можно, но это будет ещё больший кринж — нужно ведь как–то хранить состояние.  Например, через чекбокс и label for.

    Если по умолчанию всё свёрнуто и нужно разворачивать только один пункт, и не смущает, что он потом автоматически свернётся по щелчку в другое место, то тривиально через :active.

     

  • 1.13, Аноним (13), 14:49, 28/03/2026 [ответить] [﹢﹢﹢] [ · · · ]  
  • +1 +/
    Зашел, тормоза адские, не рекомендую.
     
     
  • 2.25, Аноним (22), 16:16, 28/03/2026 [^] [^^] [^^^] [ответить]  
  • +/
    Современные технологии.
     
  • 2.55, eugener (ok), 20:59, 28/03/2026 [^] [^^] [^^^] [ответить]  
  • +/
    Вообще не тормозит, я даже удивился.
     
  • 2.59, Tron is Whistling (?), 21:29, 28/03/2026 [^] [^^] [^^^] [ответить]  
  • +/
    В фурри жёстко тормозит. В хромом нормально.
     

  • 1.15, Аноним (15), 15:07, 28/03/2026 [ответить] [﹢﹢﹢] [ · · · ]  
  • +/
    Не тру. Вот RealDOOM это тру.
     
  • 1.18, Аноним (18), 15:22, 28/03/2026 [ответить] [﹢﹢﹢] [ · · · ]  
  • +1 +/
    Как же я завидую этим людям! У них столько свободного времени, что они могут этим заниматься...А тут пол жизни прошло, не всегда пос...ать успеваешь.
     
  • 1.19, Аноним (19), 15:34, 28/03/2026 [ответить] [﹢﹢﹢] [ · · · ]  
  • +1 +/
    Это враньё. Для отрисовки используется и JS, именно он говорить CSS что и как рисовать. И виртуальная машина на CSS не используется.
     
     
  • 2.53, Аноним (53), 20:48, 28/03/2026 [^] [^^] [^^^] [ответить]  
  • +/
    >> использующую для отрисовки только CSS, без применения элемента canvas и WebGL
    > Это враньё. Для отрисовки используется и JS, именно он говорить CSS что и как рисовать

    Ну, и где тут вранье? Написано же, что идет именно про отрисовку.

     

  • 1.26, Аноним (26), 16:19, 28/03/2026 [ответить] [﹢﹢﹢] [ · · · ]  
  • +/
    Это Doom начала 2000-х?
     
     
  • 2.28, Аноним (28), 16:53, 28/03/2026 [^] [^^] [^^^] [ответить]  
  • +/
    1993
    https://ru.wikipedia.org/wiki/Doom

     

  • 1.39, Аноним (39), 18:45, 28/03/2026 [ответить] [﹢﹢﹢] [ · · · ]  
  • +/
    Когда коту нечего делать... Тут целая команда облизала котов со всей округи, от ушек до кончика хвоста.
     
  • 1.42, Аноним (49), 19:21, 28/03/2026 [ответить] [﹢﹢﹢] [ · · · ]  
  • +/
    На недавнем 39C3 был отличный доклад про то, чего можно добиться через нетрадиционное использование CSS, даже без JS: https://media.ccc.de/v/39c3-css-clicker-training-making-games-in-a-styling-language
     
     
  • 2.48, Аноним (39), 20:11, 28/03/2026 [^] [^^] [^^^] [ответить]  
  • +/
    А цель какая? Сложилось впечатление, что сейчас всё ещё модно скриптов загрузить несколько метров.
     
     
  • 3.52, Аноним (49), 20:35, 28/03/2026 [^] [^^] [^^^] [ответить]  
  • +/
    Pure art, демонстрация технологии, бенчмаркинг браузерных движков.

    Там описывается (суб)культура, возникшая вокруг платформы, позволяющей публиковать посты в виде html+css, но без скриптов. Некоторые форумные движки и социальные сети позволяли использовать кастомные CSS, в результате пользователи самовыражались как могли.

     

  • 1.54, Frestein (ok), 20:49, 28/03/2026 [ответить] [﹢﹢﹢] [ · · · ]  
  • +/
    В GNU Emacs тоже с недавних пор можно поиграть в Doom
    https://github.com/minad/doom-on-emacs
     

     Добавить комментарий
    Имя:
    E-Mail:
    Текст:



    Партнёры:
    PostgresPro
    Inferno Solutions
    Hosting by Hoster.ru
    Хостинг:

    Закладки на сайте
    Проследить за страницей
    Created 1996-2026 by Maxim Chirkov
    Добавить, Поддержать, Вебмастеру