见微知著——BILIBILI前端项目分析

css分析篇

通过观察bilibili web版首页源代码,可以观察出当中的一些规则,在这只是简单猜一下css部分命名规范,组件和页面采用的书写方式为: index__[组件名|页面名]__src-[组件名|页面名]-[描述词]-,当中有一些BEM规范的影子,但又不完全一样。可以通过这个来看看他们怎么管理复杂又混乱的css体系,希望大家能从中获取收获
见微知著——BILIBILI前端项目分析

JS篇

bilibili主体部分是采用了react来构建界面的,并且项目并非单页面应用,但在登录注册页又是使用vue构建的(我怀疑是不是两个项目组开发的),当中还使用了jQuery做了些交互操作,swipe处理轮播图,fastclick处理单击双击操作。当中还采用了serviceworker做了缓存。
见微知著——BILIBILI前端项目分析
见微知著——BILIBILI前端项目分析
见微知著——BILIBILI前端项目分析

服务器篇

bilibili采用淘宝的Tengine作为代理服务器做负载均衡(Tengine是由淘宝网发起的Web服务器项目。它在Nginx的基础上,针对大访问量网站的需求,添加了很多高级功能和特性),并将请求重定向值Express服务器上。
ps:还有更细的我是无法通过这些请求看出来。比如说有没有加DNS,LVS这些是不清楚的
见微知著——BILIBILI前端项目分析
见微知著——BILIBILI前端项目分析

相关文章:

  • 2021-08-13
  • 2021-07-27
  • 2021-05-20
  • 2022-01-31
  • 2021-06-28
  • 2021-05-26
  • 2022-01-10
  • 2021-09-06
猜你喜欢
  • 2021-07-20
  • 2021-08-17
  • 2021-08-12
  • 2021-09-17
  • 2021-10-18
  • 2021-05-16
  • 2021-06-26
相关资源
相似解决方案