С WebGL ситуация с производительностью намного лучше, но этот стандарт поддерживается.
не все популярные браузеры , в частности, Microsoft даже не планирует реализовывать его поддержку в IE (по этой причине сторонние разработчики уже начали делать плагин ).
Подключив WebGL-2d и добавив всего пару строк, мы можем значительно ускорить рендеринг графики, реализованной с помощью Canvas 2d API, в браузерах, поддерживающих WebGL, и обеспечить откат к обычному 2d-контексту.
К счастью, разработчики браузеров работают над вопросом производительности Canvas-графики, появляется поддержка аппаратного ускорения 2D-контекстов, так что в ближайшем (надеюсь) будущем эта библиотека уже не будет востребована, но сегодня она определенно маст хэв.
Пример инициализации WebGL-2d и получения контекста: var cvs = document.getElementById("myCanvas");
WebGL2D.enable(cvs);
var ctx = cvs.getContext('webgl-2d');
Репозиторий проекта находится по адресу GitHub .
Некоторые примеры и тесты из репозитория не работают при прямом открытии html-файлов (Uncaught Error: SECURITY_ERR: DOM Exception 18 возникает из-за невозможности установки файлов cookie при такой схеме запуска), запускаемых на локальном веб-сервере.
В настоящее время WebGL-2d поддерживает следующие стандартные методы 2D-контекста:
- стиль штриха
- fillStyle
- инсультпрямой
- fillRect
- переводить
- вращать
- шкала
- сохранять
- восстановить
- ширина линии
- рисоватьизображение
- создатьимажедата
- getImageData
- putImageData
- начало пути
- closePath
- переместитьTo
- линияTo
- прямой
- наполнять*
- гладить*
К сожалению, на данный момент автор отказался от разработки своего детища (последний коммит был сделан в апреле 2011 года), но в любом случае проект достоин внимания.
Теги: #webgl #canvas #JavaScript #html5 #графическое программирование #разработка веб-сайтов #JavaScript #canvas
-
Многоканальные Коммуникации Против Скимминга
19 Oct, 24 -
Когда Docker-Compose Недостаточно
19 Oct, 24 -
Gnu Make Может Больше, Чем Вы Думаете
19 Oct, 24
