10 потрясающих демонстраций JavaScript с использованием 1 КБ или меньше

Автор: John Stephens
Дата создания: 28 Январь 2021
Дата обновления: 19 Май 2024
Anonim
Jest. Unit Тестирование в JavaScript
Видео: Jest. Unit Тестирование в JavaScript

Содержание

Ежегодно на конкурсе JS1K веб-дизайнеров просят создать классное приложение на JavaScript размером не более 1 КБ. Конкурс начался как шутка, но высокое качество заявок на протяжении многих лет привело к тому, что он стал блестящей демонстрацией того, что вы можете сделать с помощью горстки кода.

Вот 10 наших любимых работ на конкурс в этом году, но есть еще много удивительных работ, которые можно увидеть: ознакомьтесь с полным списком на сайте JS1K. (И если вы хотите войти, у вас еще есть время; последний звонок для записи в полночь в это воскресенье).

  • Прочтите все наши статьи о JavaScript здесь

01. Матрица - это система

Кто не получит острых ощущений от этой блестящей демонстрации, воспроизводящей знаменитую последовательность «цифрового дождя» из The Matrix с использованием миниатюрного JavaScript? Он был создан Педро Франчески всего с 956 байтами кода.


02. Апрельские дожди приносят майские цветы.

Эта простая, но увлекательная игра с набором текста, основанная на весенних анимациях, была создана Эбигейл Кабунок. Код был сжат с помощью Closure Compiler, затем вручную минимизирован, а затем, наконец, JS Crush.

03. 3D тур по городу

3D City Tour дает именно то, что обещает - вид от первого лица весеннего островного города. Используйте мышь, чтобы летать над городом, прыгать с крыши на крышу или ездить на машинах по улицам. Вы также можете просто позволить автопилоту показать вам все вокруг. Включая здания, улицы, дорожные знаки, движущиеся машины, парки, море и многое другое, вы будете поражены тем, что Джани Иликангас сумел создать все это менее чем за 1 КБ.


04. Странные кристаллы

Эта удивительная 3D-анимация от Филиппа Дешазо перенесет вас в странное путешествие по подземной шахте. «Майнеры перестали работать», - говорится в описании. «Они боятся. Кажется, все это исходит из тех странных кристаллов, которые некоторые видели. Наберитесь терпения и, если повезет, вы их увидите».

05. 1К Метеоров

Мы в Creative Bloq фанаты олдскульных игр, поэтому нам нравится этот трибьют Asteroids от Оскара Толедо Г. Он работает со скоростью 30 кадров в секунду на большинстве машин, каждая игра уникальна и, как объясняет создатель, предлагает " много реализма, так как в космосе нет звуков ».

06. Не волнуйтесь, пчела счастлива!


В этой псевдо-3D-анимации, которая запускается самостоятельно, изображена занятая пчела, летящая влево и вправо, свежая анимированная качающаяся трава с указанием глубины, красивые цветы и камера, движущаяся во всех направлениях (влево, вправо, вверх, вниз и вперед) для вашего развлечения. . Созданный Мануэлем Рюльке, код был минимизирован с помощью Closure Compiler, дополнительно оптимизирован вручную, а затем разрушен с помощью JS Crush.

07. Морфоза

Эта интерактивная трехмерная сетка - это то, с чем вам придется поиграть. Созданная Бенджамином Биллом Планшем демонстрация использует алгоритм художника для визуализации трехмерной сетки. После проецирования каждого лица в систему координат, заданную камерой, они сортируются по уменьшению глубины, чтобы получить порядок рисования. Отображаемая форма является результатом хаотической анимации между двумя заранее созданными сетками, кубом и сферой. Чтобы получить плавную анимацию для граней, геометрия сферы создается путем сопоставления каждой вершины куба (метод сопоставления куба).

08. Команчи

Эта дань уважения игре-симулятору вертолета Comanche: Maximum Overkill позволяет вам использовать стрелки для управления тангажем и креном (высота на автопилоте). Небо переключается с дня на ночь, и игра работает со скоростью 25 кадров в секунду на среднем компьютере. Разработанный Сиорки, код Packer произошел от First Crush и JS Crush.

09. Цветок

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

10. Фурби

Здесь Роман Кортес действительно раздвигает границы возможностей менее 1k с помощью 2D-холста и высококачественного оборудования. Эта красочная анимация включает рендеринг меха, крылья с художественным размытием движения и трехмерный облачный пейзаж. Чтобы в полной мере насладиться просмотром, его нужно смотреть на очень мощном компьютере с Chrome. (В другой записи, Furbee, убирайтесь из этого туннеля как можно скорее! Кортес смешал свой Furbee с записью Deschaseaux - номер 2 в нашем списке - и это тоже довольно невероятно.)

Понравилось это? Прочтите это!

  • Как создать приложение
  • Лучшие 3D-фильмы 2013 года
  • Узнайте, что будет дальше с дополненной реальностью

Вы видели потрясающее создание JavaScript за 1 КБ или меньше? Расскажите об этом в комментариях!

Рекомендовано вам
Как загрузить видео на YouTube: загрузить видео с телефона и компьютера
Читать дальше

Как загрузить видео на YouTube: загрузить видео с телефона и компьютера

В этой статье мы покажем вам, как загрузить видео на YouTube за восемь простых шагов. Во-первых, давайте установим сцену ... Итак, вы закончили свой шедевр короткометражного фильма или привели мир в п...
10 дизайнов, привлекающих деньги для Филиппин
Читать дальше

10 дизайнов, привлекающих деньги для Филиппин

На этой неделе мы стали свидетелями разрушений, вызванных тайфуном Хайян - одним из самых сильных тропических циклонов, когда-либо зарегистрированных. Поскольку число погибших постоянно растет, а мног...
Создайте тему Shopify с движком Liquid
Читать дальше

Создайте тему Shopify с движком Liquid

В течение последних нескольких недель я создавал тему hopify для Viewport Indu trie , компании, которую мы с Эллиотом Джеем Стоксом основали в прошлом году. Мы выбрали hopify по нескольким причинам:Эт...