SVG 是未来项目的正确技术吗答案

【问题标题】：Is SVG is the correct technology for future projectSVG 是未来项目的正确技术吗
【发布时间】：2018-03-14 13:40:20
【问题描述】：

我不是 100% 确定 stackoverflow 是否是问题的正确位置，所以如果我造成烦恼，请原谅我！我也很欣赏这是一个相当商业化的问题！

我发现很难找到任何关于 SVG 作为标准的活跃性以及 SVG 的未来可能是什么的信息。我基本上是在努力避免支持主流浏览器将在几年内抛弃的技术（但谁能预测未来？！？！）

我的计划是从 Adobe Illustrator 之类的工具中导出 SVG，然后允许客户使用 snapsvg 等网络技术对其进行编辑。这将允许人们编辑 svg，然后我们可以在渲染和打印（作为 PDF）方面为他们做一些事情。

SVG 的替代方案是类似于使用织物 js 的画布，以在自定义数据模型 (json/xml) 的顶部启用相同的功能。

如果有人有任何建议或信息可以帮助我做出决定，我将不胜感激。如果这不是解决此问题的正确位置，我们将不胜感激任何建议。

谢谢！

【问题讨论】：

【解决方案1】：

SVG 不会很快消失（SMIL svg 标记可能会消失，所以我不会通过它制作动画）。在某些方面，SVG 已经融入了移动设备等需要小尺寸图像的领域，尤其是徽标等领域。

就个人而言，如果您想使用 Illustrator 之类的工具并能够操作图像，特别是如果您可能在某些时候想要为图像的某些部分设置动画，我会选择 SVG。它有各种库，其中 Snap.svg 和 svg.js 是主要的 2 个（如果想做图形和图表，d3.js 是一个）。

如果您将用于开发的图像传递给其他图形设计师等，我会在源代码上坚持使用 SVG。如果有特定原因，您以后可以随时将 fabric.js 与导出的 SVG 一起使用。

【讨论】：

注意，如果您不确定要使用哪个库/技术，尝试编写从库中稍微抽象的代码可能会很有用。例如，编写您自己的函数来绘制一个形状（调用 Snap 或其他）。然后以后如果你想改变库，你只需要改变你的几个函数。而不是将 Snap 或 SVG.js 嵌套在代码中的所有位置，然后您需要换掉。

【解决方案2】：

Fabricjs 开发人员在这里。

如果您要处理矢量数据，SVG 是一个不错的选择。如果您的应用程序和客户想要创建简单的图形 SVG 就足够了。

当涉及到图片、过滤、像素编辑以及模糊或涂抹等操作时，SVG 开始不再是最佳选择。

此外，文本编辑在 SVG 中也有一些限制，因为没有换行的概念，这对于必须在 TSPANS 之上构建此概念的用户或开发人员来说可能很烦人。

与 webgl 相比，过滤速度较慢，并且更难在不同的浏览器以及 Illustrator 和浏览器之间获得完全相同的渲染。

在打印方面，您经常需要从不支持所有 SVG 功能的 SVG 更改格式，转而使用 PDF。

如果没有一个会设置自身约束的库的帮助，另一边的 Canvas 技术将更难使用。与使用 svgs 修改 dom 元素相比，修改像素通常更慢。

它为您提供开箱即用的 PNG 或 JPEG 导出，当然不会对您在导出后创建的设计或产品进行任何类型的操作，而 SVG 可以从一种非破坏性编辑中受益。

在 fabricjs 的特定情况下（因为您提到它），该库可帮助您创建文档的可序列化版本，然后您可以以更高的分辨率重新渲染或再次保存、加载和修改（导出分辨率取决于浏览器您用于在 firefox 和 chrome 上渲染可能为 12.000 x 12.000 或更高）

我认为最适合的工具取决于您想向应用程序用户提供的内容类型。如果涉及图片，我会使用画布和某种库来帮助您保存/恢复设计并抽象代码。（fabricjs不错，可能还有其他同等或更好的替代品）

【讨论】：