今天，小程序正式支持 SVG

寫在前面

經過騰訊 Omi 團隊的努力，今天你可以在小程序中使用 Cax 引擎高性能渲染 SVG！

SVG 是可縮放矢量圖形(Scalable Vector Graphics)，基于可擴展標記語言，用于描述二維矢量圖形的一種圖形格式。它由萬維網聯盟制定，是一個開放標準。SVG 的優勢有很多:

SVG 使用 XML 格式定義圖形，可通過文本編輯器來創建和修改 SVG 圖像可被搜索、索引、腳本化或壓縮 SVG 是可伸縮的，且放大圖片質量不下降 SVG 圖像可在任何的分辨率下被高質量地打印 SVG 可被非常多的工具讀取和修改（比如記事本） SVG 與 JPEG 和 GIF 圖像比起來，尺寸更小，且可壓縮性、可編程星更強 SVG 完全支持 DOM 編程，具有交互性和動態性

而支持上面這些優秀特性的前提是 - 需要支持 SVG 標簽。比如在小程序中直接寫：

<svg width="300" height="150"> <rect bindtap="tapHandler" height="100" width="100" style="stroke:#ff0000; fill: #0000ff"> </rect></svg>

上面定義了 SVG 的結構、樣式和點擊行為。但是小程序目前不支持 SVG 標簽，僅僅支持加載 SVG 之后 作為 background-image 進行展示，如 background-image: url("data:image/svg+xml.......)，或者 base64 后作為 background-image 的 url。

那么怎么辦呢？有沒有辦法讓小程序支持 SVG? 答案是有的！需要下面這些東西（站在巨人的肩膀上）：

JSX，史上最強 UI 表達式，支持書寫 XML-Hyperscript 互轉的 JS 語言 小程序內置 Canvas 渲染器