掘金 AMA：腾讯 Omi 框架做者--dntzhang 聊前端开发、谈学习路径和技术进阶

第二十期 AMA 掘金团队腾讯 Omi 框架 ( github.com/Tencent/omi ) 和 Cax 渲染引擎做者，AlloyTeam 开源负责人之一 dntzhang(张磊)作了为期三天的 Ask Me Anything (AMA) 活动（活动已结束）。咱们在此精选了一些来自用户的提问及 dntzhang 的回答。css

关于 dntzhang

腾讯 Omi 框架(github.com/Tencent/omi) 和 Cax 渲染引擎做者，AlloyTeam 开源负责人之一。html

dntzhang 是 2009 年接触的前端，一干就是十年。日月流转，岁月杀猪，细数过去十年，创过业，当过老师，作过游戏，办过工做室，作过独立开发者，也炒过股，作过直销，各类折腾，没赚到钱，甚至亏损，但收获颇丰。体验了世态炎凉，感觉过资本贪婪，眼看生活黑暗没有尽头，却能在混混沌沌中看到但愿。在 2015 年初举家从北京迁移到了深圳，加入腾讯。来了腾讯以后，已经是一双儿女的父亲，变得愈来愈保守和求稳，不敢再大动做折腾，就只折腾技术。dntzhang 热爱编程且一直在一线编程，但愿再干一个十年。前端

前端高速发展这十年，从刀耕火种(各类模板引擎，各类模块化框架，各类打包工具各类批处理)到现代化统一科技(webpack，jsx，babel，typescript，web components，小程序云开发)，微信小程序更加扩大了前端的边界，将开发体验和用户体验作到了史无前例的高度，这一批技术的背后是一批伟大的公司(谷歌、脸书、腾讯、微软)，是一批优秀工程师日夜打磨，是一厢让世界更低成本运做、让世界更美好的愿景。新生事物的产生都有其背后设计的哲学，不应只学习技术自己，更应了解其产生的动机和缘由，这样在面对新生事物和学习之时可以更加从容。vue

提问目录

社区小伙伴精选提问--技术相关

前端熟练掌握原生js真的是重中之重吗？ -@LX在掘金

您好，我想问一下前端熟练掌握原生js真的是重中之重吗？有人说看js能力定工资水平是否是真的？找工做是只会用各类框架就行仍是必须熟悉底层原理node

js能力占前端技能树的很小一部分了，因此js能力定工资必定是片面的。定工资最主要的因素是上一家的工资，以上一家工资为基准，给予必定比例的提高做为工资(前提是经过面试)。框架底层原理仍是要知道个大概，对性能优化，触类旁通，用好框架，选合适的框架，造个更好的框架都有帮助。react

Webgl的应用场景有哪些？ ─ @pureJy

目前你的工做中，Webgl的应用场景有哪些webpack

目前我接触的工做来看仍是不多，上次在线上环境使用 webgl 仍是用来兼容安卓不支持 filter 的状况下在 webgl 里处理图片模拟高斯模糊效果。不过既然渲染模式能够切换，甚至不少 2d 都使用 webgl 渲染的话，场景应该是很是多的。固然还有QQ里的勋章墙是我前同事作的，酷炫的 3d 勋章，不过模型是外包给别人设计的，同事只是 tween + three.js + 事件交互包装了一下。git

可视化方向该从何学起？-@ysxhd

可视化方向该从何学起呢，svg？canvas？仍是看炫酷的demo，学three.js D3这种框架？github

我不知道可视化方向究竟是什么方向？可是必定不是精通可视化框架的使用，而是撸一个可视化引擎。好比你列举的svg canvas webgl 共性的 matrix 变换是否了解？好比 canvas 和 webgl 里的事件绑定怎么处理？像素级别事件和box级别事件怎么处理？2d 和 3d的事件绑定有什么差别？有什么共性？好比滤镜怎么作？原理是什么吗？高斯模糊有几种方式？各有什么差别？好比threejs里的group嵌套体系是怎么叠加属性的？贝赛尔曲线相关原理和做用？贝塞尔曲线包围盒计算？贝塞尔曲线相交检测？vector2d 和 vector3d 全部的方法的几何意义？盛金公式是干什么的？这个公式在可视化里的使用场景是什么？这些也许就是方向。web

对于大数据量，您推荐使用svg吗？-@猪猪是天才

大佬，对于大数据量，您推荐使用svg吗？对于频繁操做dom有什么好建议？谢谢🙏

能够先试试 svg，撑不住再试试 canvas。频繁操做 dom 的解决办法能够借鉴 dom diff或者 vdom diff的解决方案，用数据驱动diff再局部更新视图，操做 dom 变成操做数据。

非技术相关-- 我的观点

想问一下大公司喜欢作框架的缘由是什么？钱多？-@mouren

你好，想问一下大公司喜欢作框架的缘由是什么？钱多？

相反，钱少，或者准确点为了省钱，节约人力成本，让更少的人能够建立更大的价值。大公司技术人员不少，当一个框架能减小重复性劳动，提升公司总体运做效率，公司确定会投入人力物力来研发框架。固然不少框架都是我的发起，你能够说他是有晋升须要，也许有改变世界的宿愿，固然这些都不是使用框架者该关注的，框架使用者最应该关注的是框架自己技术和设计哲学，关注它能给你或者你的项目带来什么价值亦或是那么一丁点启发，就算你不使用它。而该框架究竟是增长了世界的运行成本仍是下降了世界的运行成本是框架做者或团队会去操心，不用使用者或者围观者操心，若是框架重复了，或者没有价值，会慢慢从大众视线消失。

我是自学前端的，就是各类学本身不会的，有何建议 -@codeXiu

我是自学前端的，就是各类学本身不会的，没据说过的，如今流行的。最后接触的面广了，可是深度不深。想从新再学一遍或者巩固一遍却有点眼高手低。能不能给点建议或者是主要的方向。谢谢

因此要了解新生事物产生的动机和设计哲学，而且学以至用+兴趣驱动。主要方向我已经列举文章里，现代统一科技，用什么学什么，爱什么学什么。

非科班硕士，工做晚，见识的世界太少，感受被年轻人超越，能给一些人生建议吗？ -@songlairui

我是非科班硕士，工做晚，见识的世界太少，感受瞬间被年轻人超越，看到大家这么丰富的履历，我很羡慕。能给一些人生建议吗

硕士起点会更高一些，不用后悔工做晚。最近面了几个硕士(95-98年出生)都很优秀，虽然前端技能不足，可是基础技能很扎实，职业生涯必定会发展得比我好。作过决定就不要后悔，人生建议给不了，本身还没过好这一辈子。

中大厂招人最看中的是什么？ -@NEPT

应届生求职中，怎么拿到一份前端offer？中大厂招人最看中的是什么？你没有工做的时候(假设)，是怎么提高技术的？

社招看基础和经验，应届看基础（沟通表达、数据结构与算法、数学（我偏心问线性代数、高数等）、算法设计、参赛经验、在校成绩等）、计算机原理、计算机网络。关于怎么提高技术，我我的的习惯是：有空的时候会给本身虚构一个比较有挑战编程任务在规定的时间完成，而后写一篇文章总结一下。

在平时工做中pc端为主，并且有的技术很老旧，涉及面也不广，请问下要如何自我提升一下呢？有什么学习建议吗？-@caiweijian

大佬您好，在平时工做中pc端为主，并且有的技术很老旧，涉及面也不广，两年前端开发好像并无学到什么东西，请问下要如何自我提升一下呢？有什么学习建议吗？

准确来讲，pc的项目比移动端交互和展现都要复杂一些。因此不要认为pc项目没有技术含量，固然若是pc项目依然还使用老掉了牙的技术栈，这确实会成为跳槽或者提升的瓶颈。可是，工做之余能够搞些移动端项目，作作小程序什么的能有不小收获。

数据可视化这一块的职业发展？ -@MytLoy

你好，想请教一下：数据可视化这一块的职业发展发现

就前端这个行业总体来看，应该没有专门这样的岗位，可是面试是加分项。而加分的不是你由于精通使用 echarts d3 g3 什么的，而是理解他们设计的哲学，以及底层引擎的渲染管线等。

请问您是如何看待前端的？-@circular

当总作了十年的前端工做了，跟随时间的推移，前端发生翻天覆地变化。这里有3个问题，1.请问前端是什么？2.为何须要前端？3.前端在整个项目中的定位是什么？

这个问题有点追根溯源的感受了。前端是什么？我理解就是entry，用户交互的界面和为用户提供服务的入口。这也就解释为何须要前端，没有entry就无法到达提供的服务。将来的趋势很明显，端+云，目前初见雏形的好比小程序云开发模式，小程序承载端的能力。小程序云开发必定程度上扩大了前端的职业范围，一个前端一门语言搞定先后端一切，这是的很好趋势。前端将来的定位和竞争力依然是深挖视觉、交互、体验，将来 serverless 普及，大量传统的后端也会扑向前端一块儿开发，先后边界愈来愈模糊，一个方法的调用直接上云。总之趋势就是：一人多端，先后通吃。

您认为数据可视化的发展潜力在哪呢？-@黑化的橙以汁༎ຶД༎ຶ

大佬好😃😃 您认为数据可视化的发展潜力在哪呢或者说数据可视化之后如何更多地与需求和业务相结合呢？

潜力没看出多少。他只是前端技能树的一部分，是面试前端的加分项，图表类可视化比纯数字展现更加人性化和直观，固然其余应用好比3D机房监控，3D地铁，VR AR看房，全景图(固然这是伪3D)、模型预览等也属于可视化范畴，这些更加实用，也有不少应用在使用，比图表要有技术含量，可是涉及到的技能和专业游戏建模和开发没有太大区别了。

中级前端工程师应该掌握哪些技能。 -@小英雄雨来

大佬好，我必定多多关注。请教问题以下：中级前端工程师应该掌握哪些技能。问题描述：我是17年毕业的前端，如今的目标是正在从初级工程师迈向中级工程师，但不知道中级工程师应该掌握哪些重要技能，应该怎样学习。好比去看vue，react源码有意义吗，好比webpack应该深刻掌握吗，中级工程师具体应该掌握哪些东西呢，掌握到什么程度呢

在腾讯，中级前端(2.1-2.3)可以承担前端核心模块的设计和开发工做。若是具体技能，我文章中列举的都包含，具体看源码有没有意义，必定是有的，可是要看收益的比例，好比你是为了性能优化仍是更好得使用框架或者了解设计思路看？为了看源码而看源码是没有意义，为了成为中级前端看源码更没有意义。webpack 不只要会配置，至少能写些 webpack 插件，理解 webpack 设计哲学和插件体系的设计。

工做和考研如何抉择？-@icebns

您好，我是一名二本在校生，课余学习前端一年了，如今我面临的问题是：已经明确但愿未来从事前端工做了，还要不要去考研。不考研的话担忧本身学校实力不强，面试机会少，考研又不知道选择什么样的专业。大概就是这样，但愿能被翻牌，感谢！

先工做仍是先考研简直就是老婆和老妈掉水里先救谁同样的问题了。个人观点是：家里有矿就继续学习(修行)，工做的同时伴随着失去自由。若是是普通家庭先工做，或者边工做顺便考个研？固然研究生起点会更高，可是获取知识不必定非要在学校或者考研一个途径，哪里不能够学习。证实本身的方式不只仅只有研究生文凭一种。

各类折腾的状况下为何还从新回到了前端行业? -@不想当架构的前端不是好厨子

您好，请问您是在创过业，当过老师，作过游戏，办过工做室，作过独立开发者，也炒过股，作过直销，各类折腾的状况下为何还从新回到了前端行业。我如今作前端小有三年，过两年也到30了，对于本身将来的职业规划有所迷茫。想尝试更多的行业，可是又怕一事无成。

辞职穷三月，换行穷三年。虽然折腾过不少东西，可是本质没有离开前端，好比咱们工做室游戏是用 js 写的，独立开发的游戏也是 js 写的，当老师也是教 div + css，炒股和直销不用全职的。因此劝你别换行，选择不三思，过后两行泪。

编程时的思路或者结构上的思路? -@hackLi

我想知道的是你编程时的思路或者结构上的思路

问题划分最小单元，逐个击破

如今的大前端如此的火，单前端来讲分支也挺多，如何在步入工做后准肯定位本身，找到本身最想要发展的方向去努力？-@

您好，我是大三在校生，请问一下，如今的大前端如此的火，单前端来讲分支也挺多，如何在步入工做后准肯定位本身，找到本身最想要发展的方向去努力？在追求的道路上能够不以给一些意见或建议？

走正统到道路吧~~ 先页面重构(html+css)，再学习脚本语言（js、ts），再综合前面所学加一个组件化框架进行组件化开发，再工程化（这里主要是使用 webpack ，node 等）。再学习 nodejs，也算是一门后端语言了、再图形图像可视化，再各个阶段均可以兴趣驱动深刻，持续学习。

专题 -- Omi

omi-UI 有支持小程序计划吗？taro-UI能通用吗？ -@distupid

omi-UI 有支持小程序计划吗？taro-UI能通用吗

omiu 支持小程序的问题 Omi 团队正在规划中，taro ui用不了，taro是react语法，和 omi 语法不同。

omi的小程序和微信的原生小程序，两个同样么？ -@lishax

请问，omi 的小程序和微信的原生小程序，两个同样么？仍是说omi指的小程序是native？不太懂😅

同样的。Omip开发小程序只是把jsx和css写的omi组件编译成wxml和wxss等，最后发布上线和原生小程序本质是同样的。

omi解决了前端的哪些痛点呢？ -@蓝月萧枫

omi解决了前端的哪些痛点呢？

JSX 与 Web Components 很好的融合，并提供了Web Components向下兼容(omip)和 ssr(omis) 的解决方案，会持续跟进小程序和小程序云开发，提供优秀的开发体验(好比omip、mps 都是 omi 团队汗水的结晶)。

与Taro相比以为Omi的优点在哪里？-@Haply

Omi目前只支持微信小程序及H5应用，而Taro支持一套代码能够打出多端（微信、支付宝、百度、字节跳动）小程序、H五、React Native应用，与Taro相比以为Omi的优点在哪里？

Omip 是基于 taro 也支持其余端，只是我没试过。

omi框架是否是重复造轮子？-@小宣同窗

omi框架是否是重复造轮子？ omi与vue，react有什么理念上的不一样？相比于virtual dom,web component有什么优缺点。

Omi 既是 virtual dom 又是 web components，很妙。

小宣同窗: 我记得web components是用shadow dom，这个shadow dom 相比virtual dom有什么优缺点

0mi渲染用的shadow dom，diff 和 create都是基于 virtual dom，shadow dom 和 virtual dom没有可比性，各司其职。