dfdxf接到项目某一期的需求时，其中有一个3D地图技术难点，首先你会想到的会是怎么做呢？项目组成员不到几秒钟就不假思索道用webgl、d3等常见的一些技术，那么问题来了说都会说，实际上做是否可以像说的一样简单呢
我们前端可能涉及到可视化方面的开发大多都是一些地图及其下钻，柱状图，雷达图，折线图表等，但可能突然某一天你就接到了一个3Dd地图的可视化需求，准确分析了需求的意图后，你去网上搜了下，找到了最火的 echarts，但是从效果上来看，明显不可能随便三两下就能实现的了，可能需要考虑很多问题，例如需要哪些配置？是否需要UI出图？用的canvas还是webgl？是否有兼容性上的问题？是否有人提供技术支持？这些细节性的东西，可能就需要我们亲自去实践一番了
对于项目而言除非这个需求特别重要且时间充足，如果没做过该类的肯定是不行的，几分钟就能整明白的事情就不叫技术调研了，也无需技术调研，然而如何摆好一个技术调研的正确姿势，也没有什么标准模板，让开发人员写文档本来就够痛难受了，再加上一个没有标准的场景，简直就是double痛，既然我想做好这次技术调研，首先我们肯定要足够了解需求的，然后才能确定一个技术调研方向
比如需要你实现一个3D地图并且每个省都有柱状图能下钻的显示效果，你一看到 3D 立马就想到 three.js 甚至是 webgl，然后什么也不管了先查资料然后去找相关demo，一般这种技术代码是比较难的，尤其是在本身陌生的情况下去研究就更加困难了，结果研究了两天后，在开始做需求的时候，发现需求的重点并不是那个3D地图，而是业务最关心的3D地图上每个省份或者市的数据点，实际上业务更关心的是数据点，只是希望呈现方式有3D的效果而不是真正需要做3D，这样我们就可以在项目交付的范围内可以运用伪3D去造成一个视觉性差异达到我们所需的效果。
当然在我们探索的过程中只要你不是在划水毫无疑问地可以了解到一些跟 webgl 相关的知识，但是毕竟项目还是大都以结果为重的，即使过程曲折，所以一定要确定好要求，准确分析出需要准备的技术点，再进入下一步
当然了，做技术预研，不能说看准一个东西就一个劲闷头去弄，不仅最后差强人意也搞得自己精疲力竭甚至一度想放弃前端，还是跟PM多沟通，哪些技术需要攻克看看公司有没有熟悉的同事，相信大家也深有同感，自己搞一天都不如别人给你讲1h管用
什么时候需要技术调研
有些技术存在的时间已经足够久了，资料也比较齐全例如jQuery，但也不代表就能拿来就用，例如如果是数据展示以及页面美观程度而言，jQuery配上UI框架虽然也能实现，但是代码量级以及难度肯定会比轻量级vue更加高，考虑到后期维护以及目前前端大势所趋肯定会选择后者。
尤其是在前期考虑需充足，大致可分为如下几大类是考虑重点：
1.活跃度
主要从 github star 数、代码更新频率、issue响应速度、文档完整度、在线示例、官方团队和社区的规模等方面进行判断，一个低于 1k star、超过半年没有更新、issue很少或者响应速度很慢，低于 3 个 contributor、文档只有几段话的项目一般而言是无法用于线上环境的
例如，echarts 由业内知名公司开源，有专门团队维护、有专门的社区、几乎每天都有commit，显然是一个可选方案。还有市面上很火的antV，elementUI等一些UI框架都是首选，尽量不选择活跃不高的，毕竟如果有bug可能就需要自己去换方案了又会折腾很久
2.功能
技术永远是为实际业务需求所服务的，选出的技术方案必须能够满足需求所要求的所有功能
3.兼容性
前端必然需要考虑兼容性，比如浏览器的最低兼容版本
echarts、antv基本上都支持到 IE9，例如Iview在IE适配以及性能上做的就不如antv那么流畅（在表单上会出现莫名其妙的bug）,查资料问度娘用过iView的小伙伴们也碰到过，没有得到解决
4.性能
可以从包体积、渲染速度方面进行考量。vue工程推荐webpack-bundle-analyzer可以查看打包文件体积和依赖关系的可视化，如下图
实例：之前有个项目首页加载时间到了6s，运用这个插件分析看出main.js引入了两个UI框架，去除了一个没有用到的UI框架后加载时间提升了1.5s，运用好现成的插件也是提升效率的一种方式，当然控制台performance面板也是一个好的选择
包体积过大，一方面会导致页面加载速度变慢，其次是太大的体积意味着在一般情况下其性能也不会好到哪里去
渲染太慢导致页面空白时间过长或者浏览器失去响应，都是很影响用户体验的事情，为了加入一个功能而导致另外一个功能效果变差，那么还不如不加
5.缺陷
关注缺点的优先级高于关注优点的优先级，优点再多，也可能因为一个致命缺点而不能被应用，不过也不是所有缺陷都不能容忍的，例如pdf.js将原pdf文件转为图片后，清晰度会降低，但如果这并不明显影响体验，那么也是可以忽略的