见微知著——BILIBILI前端项目分析
css分析篇
通过观察bilibili web版首页源代码,可以观察出当中的一些规则,在这只是简单猜一下css部分命名规范,组件和页面采用的书写方式为: index__[组件名|页面名]__src-[组件名|页面名]-[描述词]-,当中有一些BEM规范的影子,但又不完全一样。可以通过这个来看看他们怎么管理复杂又混乱的css体系,希望大家能从中获取收获
JS篇
bilibili主体部分是采用了react来构建界面的,并且项目并非单页面应用,但在登录注册页又是使用vue构建的(我怀疑是不是两个项目组开发的),当中还使用了jQuery做了些交互操作,swipe处理轮播图,fastclick处理单击双击操作。当中还采用了serviceworker做了缓存。
服务器篇
bilibili采用淘宝的Tengine作为代理服务器做负载均衡(Tengine是由淘宝网发起的Web服务器项目。它在Nginx的基础上,针对大访问量网站的需求,添加了很多高级功能和特性),并将请求重定向值Express服务器上。
ps:还有更细的我是无法通过这些请求看出来。比如说有没有加DNS,LVS这些是不清楚的