将以上的理念带入到计算机领域，图形是计算机向用户传递信息的主要媒介。不论是26个英文字母构成的代码还是枯燥的二进制，在直观性上远不能比得上图形。这也是前端相对于其他领域最显著的特征。
我入行前端的过程颇有些曲折，读书期间主攻的方向是当时正热的Android开发，拿到的第一个offer是盛大游戏的测试实习生。可惜盛大要求每周五天全勤，而当时我正在写毕业论文，时间上没法保证，很遗憾地拒掉了。第二个offer是SAP上海研究院BI部门的前端实习生，有趣的是，面试的过程中没有被问及任何关于前端的东西，反而着重讨论了Android的UI适配问题。最终靠着Android开发的一点皮毛知识，因缘巧合地成为了一名前端开发者。
在SAP参与的项目是基于SVG的charts图表库，技术选型上使用的是开源的D3.js。Charts在完整的Web应用中仅仅是作为展示数据的工具，是相对小众的领域，尤其是在如今普及大前端概念的时代背景下更鲜有人讨论。我在实习的半年时间内，没有接触到AJAX/跨域/CSS兼容性这些前端“常识”，烂熟于心的是viewBox/transform/SMIL(用于实现SVG动画)等SVG图形编程的基本要素。然而尴尬的是参加校招时发现根本没有任何一家公司的前端笔试和面试会涉及这些，导致当时我郁闷地以为怕是入错了行。后来随着工作的深入，我逐渐体会到虽然charts与常规前端项目所涉及的知识点略有不同，但实际上两者的差异并非表面看上去那样巨大。
举个比较常见的例子，SVG与CSS存在同名属性transform，用法基本一致(SVG不支持3D变换)，支持translate/scale等快捷写法，也支持matrix矩阵。CSStransform的默认变换原点为HTML节点自身的中心，即transform-origin:centercenter。
SVG中并不存在transform-origin属性，其变换的的原点始终为SVG节点自身的左上角。其实CSS的transform-origin默认为centercenter是考虑到日常开发中所接触的transform大多以中心点为原点，如果将其赋值为00则与SVG等同。
transform-origin很大程度上简化了transform的复杂度，但本质上CSS的transform使用的是与SVG相同的坐标体系。事实上，CSS的transform规范本身便是在SVG1.1规范的基础上延展而来。除此之外，常规前端技术领域还存在与SVG许多相似的理念，比如CSSanimation/key-frame与SMIL、ShadowDOM与SVGuse等等。
值得一提的是，D3.js的节点与数据绑定、数据驱动UI的模式与React颇为类似，却比React的诞生早了许多年。
从图形到像素虽然相对于CSS，SVG略显晦涩，但它本身仍然是非常上层的图形编程技术。SVG是一种描述性语言，编程的主要方式是通过标签和属性的搭配，其语义性侧重功能而非逻辑。开发者需要做的是熟知各个标签和属性的功能，而无需
联系电话：