前端架构师成长之路

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/Y_anCy/article/details/78581231

前两天公司领导对员工进行岗位职责边缘划分,老大问我:“未来职场规划?”,我说:“我想成为全栈工程师!”。虽然我在公司一直做前端开发,但是作为前端工程师我总是妄自菲薄感觉自己像个门外汉,技术太浅登不得大雅之堂。所以一直想学一门后台语言,我就可以参与到公司数据结构的设计,继而进入公司核心领导层(晋职加薪~哈哈!)。而不是像现在一样“大事决定不了,小事帮不上忙~”。老大说:“一法通,万法通。把一门编程语言学到最核心,最深层,再学习其他语言也就不会有任何问题”。一席畅谈,更正我对前端多杂、乱、浅的偏见 。 我要成为公司前端的支柱,而不是仅仅技术过硬,框架熟练,开发效率快的码农!通过谈话、调研、岗位需求,根据公司产品制定一套出合适自己的学习计划:

     系统架构师是一个既需要掌控整体又需要洞悉局部瓶颈并依据具体的业务场景给出解决方案的团队领导型人物。一个架构师得需要足够的想像力,能把各种目标需求进行不同维度的扩展,为目标客户提供更为全面的需求清单。

前端架构不仅技术过硬,还需要考虑:

合理技术选型:人员,需求模块,成本维护;

网站访问数据统计,后期数据分析及合理优化;

框架层次:目录层次开发、页面层次开发、组织化架构(CMD\AMD)和设计模式(高级)。

两套开发代码:一套开发友好;一套线上友好(压缩、丑化);

//CMD规范:sea.js,延迟执行,用到时才加载;
//AMD规范:requre.js,提前执行,依赖关系前置(只要可能用到,记载提前);
define(function(){
    ....
    return {
          color:‘’,
          size:''
   };
});  
// CMD只有真正需要才加载依赖 | 性能较差 | 直到使用的时候才定义依赖。擅长服务器端:seajs
define(function(require,export){//(其他导入,属性导出)
    var b=1;
    var a=require('./a');
    a.doSomething();
});  
// AMD速度快 | 会浪费资源 | 预先加载所有的依赖,直到使用的时候才执行。擅长浏览器端:requirejs
define(['./a'],function(a){
     a.doSomething();
}); 
AMD :依赖就近(按需加载)
define(function(require,export){
    var a=require('./a');
    a.dosomething();

})

CMD :依赖前置define(['./a'],function(a){    a.dosomething();

})

resquire.config{

path:路径配置,模块名与模块实现路径相同;

}

程序员=数据结构+算法;(第二步)

前端程序员=界面+操作UI+算法;(第一步)

续文:

前端架构的思考

1.技术选型(根据团队人技术);
2.按需分解,模块边界(eg接口的友好性);
3.自动化发布与迭代;

4.降低维护成本(技术资源和人才成本);

具体准备工作:

1.代码层面:Code review & 代码规范 
2.架构层面:可扩展是受限制(根据产品);
3.协议层面:http协议优化;
4.综合:多种技术综合;

架构师必备:
一、技术:三剑客、工程化、模块化(require.js\sea.js)、resfulAPI design、设计模式;
二、性能:http、跨终端配置、数据统计(百度统计),性能优化,数据跟踪;

三、框架:页面目录结构——>项目工程结构(前后端目录、工程自动化)


======
页面工程师:页面结构划分、css规划;
前端工程师:页面API的设计、前端组件的留规划

前端架构师:既要考虑他们,又要规划开发、迭代、发布、测试

更深层次:后台业务逻辑,底层数据结构,以及产品需要,市场反馈,公司战略


展开阅读全文