帆布与SVG动画（效果[滤镜]和性能） [英] Canvas versus SVG animations (effects[filters] and performance)

问题描述

我开发应该在Web浏览器上运行同样流畅的应用程序（即支持完全是可选的），并在iPhone和测试了好几天的各种库，包括：jQuery的SVG，CAKE（帆布动画套件实验），突发引擎， Processing.js和拉斐尔，以及还没有找到合适的人进行这项实验。

I am developing an application that should run equally smoothly on a web browser (IE support completely optional) and on iPhones and have tested various libraries for days, including: jQuery SVG, CAKE (Canvas Animation Kit Experiment), Burst Engine, Processing.js and Raphael, and have yet to find the right one for this experiment.

的输入是任选的 - 的SVG或从载体呈现一个PNG是否为动画库仅有的两个要求是要能以动画（旋转）的图像，并逐渐将模糊滤波器或路径般效果。

The input is optional - whether an SVG or a PNG rendered from the vector, the only two requirements for the animation library are to be able to animate (rotate) the image, and gradually apply a blur filter or a "trails"-like effect.

我应该去为SVG或帆布，性能（Performance）和forementioned effectswise？

Should I go for SVG or Canvas, performance- and the forementioned effectswise?

previously该项目是在Flash中，但对于趋势和缺乏iPhone的支持，我决定切换到一个更进步的软件。

Previously the project was in Flash, but regarding the trends and lack of iPhone support, I decided to switch to a more progressive software.

推荐答案

在这里，您可以比较过滤性能的 SVG VS 帆布你自己。另外一个例子说明了如何做一个 SVG 3D灯光效果 VS的画布3D灯光效果

Here you can compare filter performance svg vs canvas yourself. Another example shows how to do an svg 3d lighting effect vs canvas 3d lighting effect

有很多很好的演示了在 chromeexperiments 同时显示画布和SVG。还有的 svg-wow.org 其中做了同样多跌少。

There are many nice demos over at chromeexperiments showing both canvas and svg. And there's svg-wow.org which does the same more or less.

这篇关于帆布与SVG动画（效果[滤镜]和性能）的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！