站长之家,中国草根站长新闻、建站经验、素材资源交流平台!
分类导航

站长新闻|网站运营|建站经验|网站优化|站长资源|站长源码|

服务器之家 - 站长之家 - 建站经验 - 一招制敌,搞定前端系统设计和优化题

一招制敌,搞定前端系统设计和优化题

2022-01-25 22:33前端教程 建站经验

最近接触了不少面试题目,有这么一类常见的题目,没有标准答案,上下限差距很大,第一次碰到没有准备的话,回答起来总会比较纠结。具体的题目有性能优化,提升代码质量,做埋点系统,优化webpack等,这里我把他们统称为系

一招制敌,搞定前端系统设计和优化题

最近接触了不少面试题目,有这么一类常见的题目,没有标准答案,上下限差距很大,第一次碰到没有准备的话,回答起来总会比较纠结。

具体的题目有性能优化,提升代码质量,做埋点系统,优化webpack等,这里我把他们统称为系统设计和优化题。

在这里我尝试找一下应对这些问题的套路,让大家可以在工作和面试中找到感觉,顺利过关。

下面我就同时写题目和我自己的答案,希望大家能在阅读的过程中找到一些规律。

具体题目

如何做性能优化?

问题的关键是性能,那么,性能指的是什么?页面加载的快慢和页面是否流畅。

那么用什么指标来衡量呢?页面加载时长和帧率

怎么计算这些指标呢?加载时长可以使用performance.timing,API上报,onload等事件。而帧率可以使用raf来计算。

那么我们要怎么做性能优化呢?针对用户访问的全流程,每一步进行优化。如dns解析,tcp链接,渲染页面等。详情可以查看我的文章。

如何提升代码质量?

同样我们要先想以下的问题 什么是代码质量?代码质量有哪些指标(代码性能、代码的缺陷数量)?怎么计算指标?

怎么提升代码质量?从研发的流程着手。需求评审、代码初始化、写代码(eslint)、提交代码(git commit钩子)、测试代码、发布代码(规则拦截)、数据监控

如何进行效率提升

怎么衡量效率?人日?

怎么提升效率?跟上面的提升代码质量的阶段比较接近,不重复讲了。

怎么设计埋点系统

关键的问题是数据,因此我们要从数据着手,了解我们要上报哪些数据(性能/用户行为/错误),怎么上报数据(gif,api),怎么处理数据(日志清洗,归类,存储),怎么查看数据(可视化,权限系统),怎么利用数据(生成报表,报警监控)

怎么做搭建系统

关键的元素是页面。因此我们要围绕页面的生产,页面的配置,页面的管理,页面的渲染等来进行讨论

怎么做客户端离线资源系统?

关键问题是资源。因为我们要解答发放什么资源,什么时候发放,怎么发放,怎么更新、删除资源,怎么使用资源,资源的优先级、有效期等问题

怎么优化webpack

webpack的优化可以分为缩小体积和减少打包时间两个方向。

我们可以从webpack打包的流程为切入点进行分析。

初始化参数阶段、加载插件阶段、确定入口阶段、编译阶段、完成编译、输出资源、写入文件

尾声

不知道大家找到一些规律了吗?

下面是我的思路。

找到问题的关键点,找到如何衡量关键点的方法,从系统运行的全流程进行分析,针对每个流程进行分别优化。

希望大家可以有一些收获。

延伸 · 阅读

精彩推荐
  • 建站经验网站中了木马怎么办

    网站中了木马怎么办

    网站中了木马怎么办?网站被黑中了木马也不算是比较稀奇的事情,不过大多数人是遇不到的,一般出现这种情况的网站都是一些比较高端的企业网站,或者...

    站长之家4802021-09-24
  • 建站经验网站建设初期的SEO优化定位

    网站建设初期的SEO优化定位

    根据 网站建设 的性质我们可以分为两种:一种是产品的商城,一种是做服务的网站。每一个网站在建设之前都会考虑行业的竞争对手的手法还有自身行业...

    站长之家9952021-01-28
  • 建站经验如何在百度知道发外链的技巧

    如何在百度知道发外链的技巧

    百度知道作为国内最大的互动问答平台,每天云集了数以千万计的访客,而且百度关键词搜索结果中,百度知道页面也有着不错的排名,这就让了不少站长...

    站长之家9192021-07-03
  • 建站经验网站更换服务器有什么影响

    网站更换服务器有什么影响

    在我们日常维护 网站 的时候,可能会由于网站打开慢或者网站被攻击, 服务器 内部故障或者外部的原因都会导致我们的网站出现打不开的现象,有时我们...

    东德SEO4182020-12-04
  • 建站经验关于站内搜索分析的重要性和方法

    关于站内搜索分析的重要性和方法

    SEO!PPC!内容规划!转化率啊!?当我们殚精竭力、勤勤恳恳劳作,加以虔诚的态度,拜请到各位访客,可90%的人都洒脱的挥一挥衣袖不带走一 片云彩,让咱们这...

    建站教程网9312021-06-09
  • 建站经验个人站长怎样选择做网站

    个人站长怎样选择做网站

    做网站是为了赚钱,我相信没人会反对,网站有了流量,才能赚钱,本篇文章将为大家介绍做站方向的取舍,使流量来的快,竞争小。 ...

    建站教程网5232020-09-03
  • 建站经验腾讯高手都在学的「感知性模式设计」是什么?

    腾讯高手都在学的「感知性模式设计」是什么?

    如果沿用到互联网方面的设计,那么感知性模式的例子可能包括:文字信息、版式、配色、布局、插图、图标、形状纹理、间距、交互或者动画等等,这些...

    优设7802021-08-03
  • 建站经验网店运营要学会两条腿走路:网店设计和营销

    网店运营要学会两条腿走路:网店设计和营销

    百度重新收录淘宝店,对于运营淘宝店的店主们应该是一个好消息...

    开店教程网3162020-08-21