Comments 17
Если кого-то интересуют нюансы работы с этой штукой — спрашивайте, поделюсь опытом.
Интересуют замеры и сравнение производительности в цифрах.
Прямо сейчас заняться замером к сожалению не могу, т. к. занят работой, но вот вам ссылки:
1. Здесь есть график по производительности Canvas & WebGL в общем на одинаковых задачах.
2. Что же касается самой библиотеки WebGL-2d, прямо в репозитории есть папочка с примерами, которую можно погонять у себя, а также кое-что в директории benchmarks
Обратите внимание, часть примеров нужно запускать только с http:// схемой (т. е., через веб-сервер), т. к. через file:// невозможно осуществлять ajax запросы.
1. Здесь есть график по производительности Canvas & WebGL в общем на одинаковых задачах.
2. Что же касается самой библиотеки WebGL-2d, прямо в репозитории есть папочка с примерами, которую можно погонять у себя, а также кое-что в директории benchmarks
Обратите внимание, часть примеров нужно запускать только с http:// схемой (т. е., через веб-сервер), т. к. через file:// невозможно осуществлять ajax запросы.
Правильно ли я понимаю, что портирование Canvas на WebGL с помощью этой либы заключается в том, чтобы просто инициализировать WebGL контекст? все остальное трогать не придется вообще?
Именно так. Вы просто подменяете объект, хранящий 2d контекст Canvas на этот новый контекст в своем коде, если браузер пользователя поддерживает WebGL.
В моем случае потребовалось добавить лишь пару строчек кода и приложение начало летать на WebGL (прирост производительности ощутимый).
Не без ложки дегтя — все-таки полной поддержки методов 2D контекста там нет, кое-что у меня отображалось некорректно (не хотели рисоваться тени, т. к. оказалось, что там нет реализации метода createRadialGradient и еще в некоторых случаях баги с цветопередачей).
Я планирую заняться допиливанием этой библиотеки, благо она хостится на гитхабе.
Ее прелесть в том, что можно ее просто взять и подключить, получив при этом хороший прирост производительности для пользователей, у которых работает WebGL (если повезет с наличием в WebGL-2D всех методов для работы с канвасом, которые вы использовали), никакой лишней работы.
А downgrade к обычному канвасу, в случае чего, никто не отменял.
В моем случае потребовалось добавить лишь пару строчек кода и приложение начало летать на WebGL (прирост производительности ощутимый).
Не без ложки дегтя — все-таки полной поддержки методов 2D контекста там нет, кое-что у меня отображалось некорректно (не хотели рисоваться тени, т. к. оказалось, что там нет реализации метода createRadialGradient и еще в некоторых случаях баги с цветопередачей).
Я планирую заняться допиливанием этой библиотеки, благо она хостится на гитхабе.
Ее прелесть в том, что можно ее просто взять и подключить, получив при этом хороший прирост производительности для пользователей, у которых работает WebGL (если повезет с наличием в WebGL-2D всех методов для работы с канвасом, которые вы использовали), никакой лишней работы.
А downgrade к обычному канвасу, в случае чего, никто не отменял.
Очень круто. Я был бы безумно рад, если бы вы кто-то развивал эту либу. Было бы классно видеть не только список того, что работает, но и список фич, которые НЕ работают.
Самый важный для меня вопрос — поддерживает ли она drawImage в скрытый контекст и drawImage элемента canvas, а не image
Самый важный для меня вопрос — поддерживает ли она drawImage в скрытый контекст и drawImage элемента canvas, а не image
В скрытый — конечно же да.
Рисование тоже, но отрисовка картинки не со своего домена без явного x-origin-allow — не возможна в принципе.
И вообще не надо что-то ждать от этого убогово канвасика, GL ES конечно тоже еще тот обрубок, но сделать можно практически все, и более правильно.
Рисование тоже, но отрисовка картинки не со своего домена без явного x-origin-allow — не возможна в принципе.
И вообще не надо что-то ждать от этого убогово канвасика, GL ES конечно тоже еще тот обрубок, но сделать можно практически все, и более правильно.
Ну судя по моему опыту использования WebGL (в виде three.js), то ему без разницы, можно подсовывать и канвас, я именно так и делал.
Спасибо за информацию, библиотека действительно может оказаться весьма полезной во многих случаях, держите нас в курсе.
Жаль, не наоборот )
Хорошо бы попробовать её на вечно тормозном kothic.org/js/
Без дуг и кривых выглядит бесполезно :( Но вообще, конечно, проект интересный.
Sign up to leave a comment.
WebGl-2d.js: Реализация Canvas 2D API на WebGL