Рубрика «javascript» - 547

Интерактивная HTML5 визуализация по мотивам «Lost»

Поклонник одного из лучших телепроектов последних десяти лет «Затерянные» («Lost») программист Сантьяго Ортиз (Santiago Ortiz) создал прекрасный пример интерактивной визуализации взаимоотношений между главными и второстепенными героями шоу при помощи HTML5.

Сериал создавался силами более 30 сценаристов, которые должны были прорабатывать характеры и взаимоотношения главных героев, создавая при этом реалистичную атмосферу с точки зрения перемещения героев во времени, следить за непротиворечивостью событий, и при этом давать намёки на всевозможные загадки (например, почему Кейт видела в джунглях тёмную лошадь); при этом wiki-проект по мотивам шоу содержит более 7000 статей.
Читать полностью »

На сегодняшний день мы не испытываем недостатка в прекрасных вещах, которые написаны на JavaScript. Да и реализации JVM в JavaScript мы уже видели. Теме не менее, Doppio представляет собой наиболее полную и активно развивающуюся JVM.

Doppio — JVM, Компилятор и дизассемблер в JavaScript
Читать полностью »

ObjectScript — новый встраиваемый и очень легкий объектно-ориентированный язык программирования с открытым исходным кодом. ObjectScript расширяет возможности таких языков, как JavaScript, Lua и PHP. Синтаксис в основном взят из JavaScript, множественное присваивание — из Lua, работа со свойствами — из PHP.

ObjectScript 0.97-vm2 быстрее, чем PHP 5.3.3 и JS на 34% и 61% соответственно.

Как тестировалось

Для тестирования был взят алгоритм Fannkuch. Довольно удобный тест, одна функция с параметром, при увеличении параметра на 1, количество вычислений увеличивается примерно в 10 раз.Читать полностью »

Веб компоненты с LibJSПо факту, LibJS это связка нескольких библиотек. О Mask и Include я уже вкратце рассказал, а сегодня завершит трилогию CompoJS(@github).

Постановка задачи

  1. разработка компонент вне основного проекта
  2. «dev»-независимая маршрутизация — route('compo','file:///d:/dev/compo/{name}/lib/{name}.js');
  3. легкое внедрение в проект — include('compo','mycomponent');
  4. инициализация прямо из макета — <myComponent <!-- settings --> /> (без javascript-a)

Итого 2 строчки кода, (3) и (4), и компонент подключен в проект вместе с ресурсами и другими компонентами. Больше не надо копировать картинки и стили — все под капотом. Хочу отметить, что разрабатываю в основном мобильные приложения, так что «под капотом» должно быть что-то легкое, но очень быстрое. В статье также будет приведен пример компоненты с использованием библиотеки @PrismJSЧитать полностью »

Делая ремонт на своем стареньком сайте (т.е. переводя его на HTML5), я обнаружил в стенах и деревянных поверхностях дыры и трещины, которые необходимо было залатать. Для этого я использовал шпатлевку, обеспечивающую гладкую и ровную поверхность. Затем необходимо подкрасить и, конечно же немного магии.

А вот и методы решения проблемы:

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

Читать полностью »

Совсем недавно я начал изучать JavaScript, затем JQuery, и теперь потихоньку перехожу к плагинам и фреймворкам построенным на основе вышеупомянутых технологий. Параллельно с изучением JS верстаю небольшие сайты-визитки, и вот у меня возникла необходимость сделать “карусель” из картинок. Оказалось, есть уже готовые решения, и об одном из них я хочу вам рассказать. Данная статья является выдержками с оригинального сайта фреймворка RounAbout.Читать полностью »

С удивлением обнаружил что на Хабре никто не упоминал о такой удобной библиотеке как SugarJS.
На самом деле у них очень информативный и простой сайт — где все уже хорошо написано.
Я просто постараюсь обозначить основные моменты.

SugarJS — Синтаксический сахар для JavaScript

Что такое SugarJS?

SugarJS — это open source (лицензия — MIT) библиотека Javascript, который расширяет нативные объекты полезными методами. Она разработана, чтобы быть интуитивным, ненавязчивым инструментом повышающим выразительность кода, который позволял бы делать больше с меньшим количеством кода и меньше задумываясь над рутинной.

Кратко...

  • Расширяет нативные элементы Javascript полезными, интуитивными методами.
  • Прост для понимания и в использовании.
  • Метод SugarJS не используется при наличии метода в родной реализации браузера
  • Имеет систему тестирования, имеющую огромный набор тестов.
  • Расширяет возможности работы с датой и временем, обеспечивает их форматирование на нескольких языках (русский есть)
  • Отлично ладит с другими фреймворками и сторонним кодом.
  • Модульность, вы можете включать только нужные пакеты.
  • Полностью совместимый ECMAScript.
  • Заявлена поддержка всех основных браузеров, включая мобильные
  • Поддерживает Node.js.
  • Имеет хорошую и удобную документацию.

Заинтересовало? Добро пожаловать под кат.
Читать полностью »

Эффектная анимация разрушения (Pixel Dust) В процессе развития нашей игры на HTML5, мы столкнулись с дилеммой: рисовать для каждого элемента эффект разрушения или попробовать сделать это программно на JavaScript (canvas). Если с первым способом всё понятно (проверенно работает, но много работы художнику), то со вторым у нас были сомнения относительно скорости рендера, ведь это 60FPS x 64 x 4 байта ~ 1 МБ/сек. на один элемент, а если их 40 на одном экране?

Читать полностью »

В современном вебе используются две основные технологии определения возможностей браузера:
(а) распарсить юзер-агент, определить версию браузера и писать в коде свитчи по версии браузера;
(б) пытаться определять поддержку фич путём проверки нужных полей / вызовов нужных методов.

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

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

Это всё хорошо и правильно, но только для небольших проектов.

Читать полностью »

С каждым днём во мне крепнет осознание того, что JavaScript стремится играть ту же роль (занять ту же нишу), которая была свойственна Бейсику лет тридцать или двадцать пять тому назад.

Иными словами, JavaScript становится простым и распространённым языком, далеко переросшим своё первоначальное предназначение, и на нём теперь можно сочинить почти какое угодно приложение (и клиентское, и серверное, и консольное… и даже с GUI, как я недавно убедился).

Создаются целые операционные системы (Firefox OS, Google Chrome OS, Open webOS), для которых JavaScript является не менее «родным», чем Си для UNIX в своё время.

Появляются языки, транслируемые в JavaScript (можно вспомнить CoffeeScript, Dart, новорождённый TypeScript, и так далее).

Заметив это, уместно тотчас же порадоваться тому, что к джаваскрипту предъявляют, по крайней мере, меньше серьёзных претензий, чем некогда к Бейсику, который по справедливости невзлюбили за его GOTO и поощрение «макаронного кода». Притом джаваскрипт гораздо лучше переносится и с платформы на платформу, и из браузера во браузер.

Кроме того, многие существующие проблемы джаваскрипта не имеют особенного значения, потому что устраняются широко распространёнными средствами с открытым исходным кодом. Так, нестрогость синтаксиса устраняется строгою проверкою исходного кода (JSLint, например). Нехватка средств обработки данных (массивов, объектов) и функций устраняется подключением Underscore, а строки помогает обработать Underscore.string, а даты — moment.js, например. Сложность употребления методов DOM (в которой, впрочем, повинен не язык JavaScript, а браузеры и их разнобой) преодолевается с помощью jQuery. И так далее. Это входит в привычку у программистов.

Читать полностью »


https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js