Выбор между технологиями SVG и Canvas

Если отвечать кратко: обе технологии можно использовать. Но стоит учитывать, что:

  • SVG — технология рисования с хранением объектов в памяти (Retained mode graphics). Это значит, что её предпочтительно использовать для реализации интерактивных действий (таких как управление мышью и т.п.), поскольку события привязываются непосредственно к элементам DOM. Например, SVG отлично подходит для создания карт и т.п.
  • Однако, эта технология не очень подходит для тяжёлой анимации, поскольку DOM, в общем-то, медлительный. В частности, SVG не рекомендуется для построения быстроизменяющихся детализированных графиков и т.п., так как их построение требует много манипуляций с DOM, что может просто подвесить браузер.
  • Касательно библиотек для работы. С ходу могу порекомендовать raphaeljs. Отличная, простая в использовании вещь.

Теперь что касается Canvas.

  • Это технология мгновенного рисования, она не хранит свои элементы в дереве DOM, следовательно там не так удобно вешать события на объекты. Хотя, если прибегнуть к сторонним библиотекам, то можно добиться довольно-таки комфортной работы с событиями.
  • Зато эта технология отлично подходит для пиксельного рисования объектов, и особенно — для быстрой анимации.
  • Из библиотек могу посоветовать processingjs, libcanvas и jCanvaScript

Ответ №2

Лично я бы порекомендовал тебе остановить свой выбора на Canvas. Добиться кроссбраузерности можно с помощью библиотеки ExplorerCanvas, которая позволяет реализовать приемлемое отображение в InternetExplorer.

SVG хорошая вещь, но в контексте тенденций развития HTML можно сказать, что Canvas становится дочерней технологией в HTML5.

Есть ещё один нюанс, который стоит учитывать при выборе между ними. SVG — векторная технология, а Canvas — растровая. Это означает, что в разных проектах, в зависимости от их типа, одна технология может быть значительно предпочтительной другой в плане производительности.

По вопросам рекламы ammmcru@yandex.ru
Adblock
detector