掘金 AMA：听奇舞团团长--月影谈论他对技术 & 我的成长见解

时间 2019-11-08

标签 ama 团团谈论技术我的成长见解繁體版

原文原文链接

第十八期 AMA 掘金团队请来了奇舞团团长，《JavaScript 王者归来》做者，目前 360 技术委员会前端专家--月影作了为期三天的 Ask Me Anything (AMA) 活动（活动已结束）。咱们在此精选了一些来自用户的提问及月影的回答。php

关于月影

你们好，我是奇舞团团长月影，《JavaScript 王者归来》做者，目前 360 技术委员会前端专家。过去曾就任于百度和盛大创新院，毕业于浙江大学。前端

2006 年接触的前端，在此以前作过底层算法、服务端开发甚至售前和售后技术支持。他进入前端行业源于偶然，但从 08 年开始在百度有啊带前端团队到如今，恰好经历了前端行业快速发展的十年。就我的而言，从事技术管理的时间要多于作前端开发的时间，然而他本质上仍是一名程序员，很是热爱写代码。尽管如今带一个数十人的技术团队，但每年他都坚持亲自参与一线项目和技术平台。去年他在可视化领域作了一点稍稍深刻的研究，所以诞生了SpriteJS 项目和周边工具。vue

月影一直坚信的一个管理理念是创建有效组织优于一切管理手段，所以他在奇舞团推进创立前端技术自媒体《奇舞周刊》、众成翻译、技术翻译小组、泛前端分享会、奇舞学院、w3c 兴趣小组等一系列组织并激励和推进它们良性发展，这些组织为奇舞团全体小伙伴提供源源不断的“能量输入”，帮助你们共同成长。node

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

前端如何处理缓存 ( 业务型问题 ) ？ ─ @JackieZhang

请问一下vue项目打包上线以后发版以后，浏览器打开老是旧资源须要刷新，刷新以后是新资源，可是下次打开又是旧资源须要刷新，请问这种问题怎么处理？我前端也没有设置什么缓存策略react

你看一下请求资源的HTTP请求头，这种现象颇有可能大家服务器或者大家用的第三方CDN上返回了Cache-Control头，若是有Cache-Control头，要么让他们去掉，要么大家发版的时候每次更新资源时换一个新的URL或者加一个随机参数。git

没有Cache-Control头，换一个新的URL或者加一个随机参数有相应的文章吗？这个问题很久了，就我一个前端不知道怎么搞😭程序员

不是看你网页的HTTP请求，是看你的静态资源里面的Response Header里面。通常来讲若是大家的静态资源走CDN的话确定有这个响应头。你的vue项目打包用什么？若是是Webpack的话，有对静态资源进行hash的插件，若是用别的打包工具也有相似的配置或者插件。github

服务器或CDN设置 Cache-Control: max-age=xxxxxx 是为了减小浏览器对资源的请求，这种类型的缓存是强缓存，区别于etag/Last-Modified/Expires，这些是协商缓存。只有从地址栏或收藏夹输入网址、经过连接引用资源等状况下，浏览器才会启用强缓存。因此咱们才会输入网址访问页面看到旧的资源，而刷新页面浏览器才请求新的资源。web

我看了vendor.js,，请求头以下，from memory cache；算法

你的响应头没有其余的了吗？既没有cache-control也没有expires？那就奇怪了。。。若是有强缓存from disk cache是正常的。我前面写错一个，cache-control和expires都是强缓存的头。

哦，还有一种可能，就像1楼说的，你是否是启用了pwa资源被缓存到ServiceWorker？

非技术相关-- 我的观点

请问您对于前端图形化趋势的见解？ -@张优秀zz

请问您对于前端图形化趋势的见解

我如今在作可视化相关的东西，因此去年设计了 github.com/spritejs/sp… 开源框架，正好上一次D2的时候 winter 大大去讲了一个 spritejs 的 topic，www.yuque.com/preview/yuq… 基本上说出了我对图形化趋势的见解，我以为这个领域将来必定会有很大的空间，不说其余相关的领域，就大屏可视化展示这一块，将来几年会有很大的市场。

怎么样才能够有效利用时间作好前端开发呢？-@、子筠

团长大大好，我是入行不久的前端小白😀。想请教您，学好前端的方法。咱们如今是前台，中台，后台这种开发模式，我以为本身天天加班可晚，效率还可低，业务比较复杂，前端既要处理不少数据又要作好交互，怎么样才能够有效利用时间作好前端开发呢？另外，还想请问您，关于前端这十年来的变化，您有何感悟？将来你以为会如何变呢，做为小白，咱们又如何提高本身以不变应万变？

作好时间管理，保证本身有必定的时间学习，养成适合本身的知识沉淀习惯，有的人适合写技术文章，有的人关注和参与开源项目，方法能够不同，要找到适合本身的。过去十年的前端变化我认为是互联网产品和硬件与终端技术的发展使得前端再也不是面向单一领域而成为一种通用技术，对应地，框架和工具发展成为特定领域的技术。元编程思想是框架设计的主流，工程化和质量提高是web产品的规模化推进的。将来5G的普及必定会让web产品更复杂，更具规模化，因此将来前端还会有更大的发展空间。如今仍是应该关注JS标准自己的演变，打好程序和数学基础，关注本身感兴趣的前沿领域好比VRAR、AI、可视化等等。

请问前端将来可预见的方向以及将来的趋势。 -@几何。

想请教一下关于前端将来可预见的方向以及将来的趋势。

还有做为前端萌新，感受前端的内容实在太多，学的多不容易精，相似数据可视化，算法，框架，打包工具，插件，兼容性，这里边的每个均可以花大量精力去研究。

请问如何在这种状况下持续提高自身的价值。

大约10多年前，前端只有一个领域，就是PC的浏览器，因此那时候不管HTML、CSS仍是JS都是领域语言（DSL），因此那时候你们感受内容很少，天花板不高。可是如今，前端已经不是一个特定领域，而是一个比较通用的大领域，基本上能够说前端等于UI领域，甚至更大的领域（对于JS来讲）。

JavaScript也从一个基本上算是DSL的语言成为一个通用的编程语言。若是咱们回过头来看这些年前端技术的发展，你就会发现其实其中的最主要脉络，用一句话来归纳就是“从通用到特定领域”，其实这也是其余编程语言和技术的发展路线。

其实这个趋势从jQuery时代就开始了，jQuery就把原生的JS定义为“通用语言”，而后它自身是一种DSL，从JS到jQuery实际上是一种“元编程（MetaProgramming）”，就是用一个通用领域的语言去实现DSL。jQuery的DSL就是它的链式调用语法和隐式迭代语义。在那个时代，JS尚未那么强大，不多元编程特性，可是jQuery经过巧妙的API设计实现了“元编程”。

而如今，JS远比过去更强大，有不少元编程特性，好比属性访问器、内置Symbol、Proxy等等，而后咱们还有Babel和Webpack这样的工具，因此咱们如今的前端框架能够在这之上经过元编程创建更强大的DSL，因此不管是React、Angular仍是Vue，它们其实都是创建DSL，以DSL解决特定领域的问题，提高开发效率，这是框架设计（造轮子）的基本思路。

因此咱们沿着这条路梳理下去，你会发现，将来随着互联网环境的进一步发展，好比5G，随着互联网产品的进一步发展，会有更多的专有领域，这些领域固然也会促生更多的DSL，因此咱们说前端百花齐放。若是你把握了这个基本的脉络，我想你应该知道如何去学习前端技术了，HTML/CSS/JavaScript是通用既能，须要紧紧打好基础，其余的能够归为领域相关的知识，在须要用到的时候去学习。学习这些领域知识，不只仅是学习其API和如何使用，更应该理解其背后的“元编程”思想和原理，这样若是你未来面对了新的领域，就知道如何站在前辈们的肩膀上造一个伟大的轮子了。

应该怎么样养成好的代码思路？ -@诤阳

我是刚入职一个月的实习生，我发现我作页面没有清晰的思路，最后作出来的东西很乱，效果有，老大说无法上线，应该怎么样养成好的思路

写页面和写代码同样，能够用自顶向下的设计方法，先解析大的结构，完成框架的设计，而后逐层向下设计细节。根据产品需求和实际运行环境肯定大的页面结构，而后选择布局的方式，好比标准流布局仍是弹性布局仍是grid，以后对每一个局部递归进行次一级结构的设计。要学会运用BFC。良好的结构加上语义化标签，就能写好HTML。

就是采用自顶向下的设计，先设计总体布局，而后对每块再进行迭代作次一级的结构和布局，标签的话能用语义化尽可能用语义化，可是也不强求。HTML代码也是能够减小耦合的，好比运用BFC以后，其中的元素就不会受到外界影响，那么这个块就具备比较好的复用性。咱们一般用支持组件化的框架来作组件化开发，这样开发复杂Web应用的时候代码复用性好，开发效率高，可是实际上就算不用组件化框架，纯写HTML，也是能够运用低耦合的组件化思路的。

请问js 转ts是趋势吗，仍是只是web方面更适合Ts呢 -@一条没有梦想的咸鱼

请问js 转ts是趋势吗，仍是只是web方面更适合Ts呢

我以为动态类型和静态类型各有好处吧。除了你们都知道的静态类型检查有助于提早发现代码的问题以外，TS的一大优点是静态类型比较好用工具进行优化。举个例子，我最近在作可视化相关的研究，处理图形须要矩阵运算，而矩阵运算的库确定性能越高越好，但有的时候运行时的高性能和易用的API是矛盾的，可是咱们能够经过编译来解决这个问题，因此我写了一个babel插件经过编译来解决API使用的问题 github.com/akira-cn/ba… ，可是，由于这是一个JavaScript库，因此我没有办法在运行时断定某个变量的类型，因此我就只能要求使用者在进行矩阵运算的地方额外声明变量的类型，好比 p * q 是普通的运算，vec3(p) * vec3(q) 才是求向量外积的运算。

若是这个库是TypeScript库的话，那么咱们就不用这么作了，彻底可使用 p * q，由于咱们在编译时就能够知道它们的类型。前面说的是TS的优点，但静态类型和动态类型相比，仍是动态类型更加灵活，因此有些项目不须要太依赖于类型检查的话，用动态类型彻底没有问题，大多数时候，咱们用eslint来检查一些规范和错误就够了。

来前端会有哪些新技术可能会火？前端想学习后台技术的话怎么一个过程会比较好？-@RickFang

请问前端朝哪些方向努力能更快成长，让本身比较突出，将来前端会有哪些新技术可能会火？前端想学习后台技术的话怎么一个过程会比较好？

朝本身喜欢和感兴趣的方向努力。我我的认为5G时代会给前端带来一些颠覆性的改变。

想学习后端技术能够从Node入手

当项目进入平稳期，进行平常维护的时候，怎样才能创造更大的价值 -@吴俊毅

当项目进入平稳期，进行平常维护的时候，怎样才能创造更大的价值

须要学会时间管理，自我学习和成长。好的团队会搭建好平台帮助成员成长，但再好的平台也须要靠本身的自驱力才能利用好。

你自我成长了就是创造了更大价值，由于有新的挑战来的时候你就能够作出更惊艳的做品来。

请问您是如何在工做中发现乐趣，从而转换为继续努力下去的动力的？-@半橙汁

大佬好，请问您是如何在工做中发现乐趣，从而转换为继续努力下去的动力的？自制力是个好东西，但是真正运用起来就颇有难度了。

我可能天生就以为编程有趣。自制力是用来帮助你跨过某个坎儿的，不是用来让你成功的。我比较相信多巴胺驱动，要想达到必定高度，必定要找到本身真正的乐趣。就像长跑同样，跑完以后会身心愉悦，可是过程当中会有难受的时候，这就须要自制力来帮你迈过艰难时刻。若是那个终点不是你真正想要的，每一步都是痛苦，那么靠自制力是没用的，而结果若是是你想要的且乐在其中，那么自制力能够帮你。要得到更强的自制力和享受过程当中更多乐趣，冥想能够帮助你。

大佬怎么看待读框架源码和设计模式的前后顺序？-@废柴阿蔚

大佬怎么看待读框架源码和设计模式的前后顺序？

说实在我不怎么读框架源码，须要用的时候才去看。设计模式我以为是基本功，不过其实不只仅是设计模式了，更重要的是抽象能力，设计模式只是抽象的一些概括，个人理解。我以为还能够多花点时间在数学、数据结构、算法等基本功上，对JS也花点时间深刻学习，而后能够试着本身去设计框架。

原先作php开发，如今想转前端，87年的，有什么好的建议 -@巴乔同窗

我想问下，大龄程序员公司会要吗，原先作php开发。如今想转前端，87年的，有什么好的建议

你原先php这块的技术级别是怎样的？高级别工程师是跨界的。若是你本职能力很强，那么不用担忧，转前端应该是很轻松的事儿

2年多的php开发经验，平时主要写后端接口，写业务。感受如今本身遇到瓶颈了。不知道如何深刻学习，本身想多接触点前端。但如今比较迷茫。一个年龄大。一个技术上不知如何深刻发展。

若是是这样我建议能够从Node入手，你能够先尝试php转Node，熟悉了JS，而后再尝试前端，这样会平稳一些

nodejs也算中高级前端必会的了，一个牛逼的前端的技术方向是什么？-@疾风知劲草

大佬好，如今前端框架层出不穷，nodejs也算中高级前端必会的了，一个牛逼的前端的技术方向是什么？是涉及后端作全栈仍是选一个特定方向如数据可视化，网页游戏深耕呢？

前端是一个职业发展方向，但不该该是技术学习的限制，我不建议前端工程师们把本身的技术和视野限制在前端领域。各类技术是能够互相借鉴的，我本身平时用的除了JS外，像PHP、Python、C和C++都偶尔使用。像可视化之类的领域也是值得深挖的，但深刻研究下去技术边界就会越过前端领域，好比说掌握glsl，理解gpu，底层绘制还涉及比较多的数学知识，如线性代数、分形几何等等，这些都是能够深刻学习的。

大佬如何看到层出不穷的框架? -@一只大表哥

大佬如何看到层出不穷的框架?仍是对具体问题用具体框架

如今的流行框架的本质是用元编程（MetaProgramming）技术实现的DSL。尽管技术自己进步不少，应用场景也丰富了不少，可是无论是React、Vue仍是Angular本质和jQuery依然相似，就是用元编程思想改写或建立新的语法和语义，用来高效率地解决某些领域问题。

那么为何要这么作呢？是由于随着Web应用的发展，原先的领域边界不断被打破，前端的范畴愈来愈广，JS也从一个本来浏览器端的领域语言(DSL)发展成为了一门通用语言，因此相应地前端技术从一个（PC浏览器）领域技术慢慢演变成一门通用技术。既然是通用技术，那么对应出现的新的细分领域，固然有更适合的领域语言或技术取代原来的位置，由于这些技术在特定领域能产生更高的生产力。

因此不管是React、Vue、Angular仍是其余框架，咱们谈论的时候都不该该脱离特定领域，咱们理解和学习它们的时候也是同样。我想这能回答你提的这两个问题。

非技术相关-- 360 篇

360如今都有用vue/react/Angela开发吗？ -@王觉

我想知道360如今都有用vue/react/Angela开发吗？以前很喜欢大家，可是移动端大家掉队了，加油鸭

咱们对技术栈没有偏好，咱们支持的业务用vue/react/angluar的都有，不一样的业务适合的技术栈不一样。咱们会在代码规范和CI方面来要求你们，可是在框架选择层面上相对自由。

今年360的前端星选拔要求大概是怎么样的呀？ -@jiumi

团长好，想问一个消息，今年360的前端星是已经开始了吗？今年和往年是否是不同呀？北京一周学习没有了？还有。。。。😝😝这个的选拔要求大概是怎么样的呀

前端星应该快启动了，选拔要求和标准咱们正在紧张制定中。具体你关注咱们360招聘微信公众号，到时候咱们会通知的。

大专或者大专自考了本科，能不能进360 -@愣锤

大专或者大专自考了本科，能不能进360，假如技术ok的话

咱们社招并无必定要有学历，若是你有能力，是能够投简历试一试的。

福利--和月影共事

能够同月影大大共事的机会，360 奇舞团找人 ing

360 前端工程师

负责公司信息流、商业化业务的前端开发。
参与公司前端技术平台的开发。
参与前端新技术的预研。

任职要求

具有2年以上Web前端工做经验，熟练掌握HTML5/CSS3/JavaScript相关技能
有较强的JavaScript编写能力，可以使用原生JavaScript实现复杂功能和UI模块
充分了解Web标准，熟悉浏览器规范和兼容性
视野开阔，心态开放，不排斥新技术
良好的沟通能力，较强的责任心
了解Node，有Node服务端开发经验者优先

关于奇舞团

咱们是 360 最大的前端团队，由月影亲自带队。咱们团队有 ThinkJS 的做者李成银、赵文博、梁超等前端大牛，负责 360 总体前端平台的搭建，并支持 360 大部分核心产品的前端研发。咱们的奇舞周刊是国内前端圈子里很是受欢迎的技术周刊。咱们还有本身的技术创新产品包括爆米兔、声享、众成翻译等。

咱们是国内最优秀的前端团队之一，有深厚的技术沉淀和完备的人才培养体系，期待你的加盟，为你提供良好的成长舞台。

简历投递：t.cn/EfoY4jY

因为篇幅缘由，本期只摘录了部分问题，月影也回答了不少其余的技术、非技术问题，欢迎去他的 AMA 下面交流技术哟，传送门。