当我们接到一个项目需求, 单从前端的角度来思考, 我们需要做哪些事情呢?从哪些方面去考虑和架构一个项目? 这也是考验是否有独立完成项目的能力...我大概想到以下几个方面吧, 先写个目录, 以后有时间再进行扩展

性能优化(渲染层面) 这里主要是针对浏览器渲染进程的工作流程做出的一些优化, 有个宏观的概念...我们来回顾一下渲染进程的工作流 渲染进程工作流 1.DOM Tree 构建 {代码...} 2.样式计算, 构建cssom(css规则树) {代码...} 3.计算布局, 生成layout tree {代码...} 4.分层,绘制(layer -> paint) {代码...} 5.分块,光栅化...

个人理解, 存储方面的优化其实也是为了减少 http 请求, 节省网络传输带来耗时影响...把我们需要的文件资源缓存在本地, 或者缓存在代理服务器, 源服务器等. 都是为了优化资源访问的过程...这里我们单纯的从前端能操作的存储来讲, 服务端的手段会介绍下,毕竟全栈也是我们的目标,ememm...

当浏览器从第三方服务跨域请求资源的时候,在浏览器发起请求之前,这个第三方的跨域域名需要被解析为一个IP地址,这个过程就是DNS解析;DNS缓存可以用来减少这个过程的耗时,DNS解析可能会增加请求的延迟,对于那些需要请求许多第三方的资源的网站而言,DNS解析的耗时延迟可能会大大降低网页加载性能。

我们先了解下js引擎(解释器/编译器结构), js引擎可以理解为根据ECMAScript定义的语言标准来动态执行JavaScript字符串...js 引擎基础 js 执行环境 整个解析过程可分为: 语法检查阶段 -> 运行时阶段

在解析 HTML 构建 DOM 树时, 渲染线程会解析到script标签, 则会将执行权交给 js 线程(引擎)来接管, 此时 js 引擎开始干活了,那么他到底是怎么个干法呢? 这里其实在作用域那一块已经提到了, 那里是以es3 的规范为基础说的, 这里我们按es6的新规范来理解...

浏览器下的一次网络请求流程 以输入 [链接] web 请求本质上就是一台主机去另一台主机获取对应的资源. 1.进程切换 当导航栏输入 [链接] 浏览器进程把这个url交给网络进程处理, 给我去这台主机下取资源; 2.解析请求的URL,DNS查询IP,准备端口 URL: 统一资源定位符 {代码...} DNS(域名与IP的映射系统) {代码...} 端口port {...

简单地说, 就是操作系统可以同时运行多个任务。真正的并行执行多任务只能在多核CPU上实现,但在实际应用中,由于任务数量远远多于CPU的核心数量,所以,操作系统也会自动把很多任务轮流调度到每个核心上执行,让各个任务交替执行,任务1执行0.01秒,切换到任务2,任务2执行0.01秒,再切换到任务3,执行0.01秒……这样反复执行下去。...

typescript 的优点 静态弱类型语言, 编译时就会报错, 降低bug,低级错误出现的可能性 自带代码提示,类型注解 对于多人合作的项目比较友好,降低沟通成本

温故而知新,可以为师矣. 相信大家都会有这种感觉,很多学过的知识经常不使用就会慢慢遗忘!!!本文把以前自己关于 ES6的入门读书笔记重新汇总了一下,并结合了工作中常用的使用场景...

因为最近接手维护一个基于 ivew 的项目, 新增模块中包含很多自定义功能, 所以大量使用到了 render 函数; 故对其做一下总结...关于 render 函数, 官方文档也做了比较详细的介绍: render 函数: [链接] ; 一般组件我们都是用 template模板的方式去写; 有时候会造成代码上的冗余, 不好扩展.

前段工程化主要目的就是提高团队的生产效率,可以理解为凡事能提升团队开发效率的规范,准则,工具啥的都可以归纳到前端工程化里面来; 最近也花了点时间把前端 team 的基本规范梳理了一下, 这里做一下总结. 现阶段我把工程化主要分为三大部分: 规范化, 模块化, 组件化; 针对每个部分都要有相应的实际措施. 这一篇主要介绍规...

直接向远程服务器 push 测试分支代码, 看看流水线是否在构建代码,如果是,则恭喜成功了,以后部署直接 push 一下就完事了,不用手动传了.

本篇主要是记录一下对js中对于原型的理解... 原型 原型涉及到构造函数, 原型对象, 实例化对象三者之间的关系... 构造函数 {代码...} 实例对象 {代码...} 原型对象 {代码...} 下面用一张图来表示他们之间的关系... 原型对象中可以存储很多成员属性和方法,多个实例对象之间就能共享这些属性和方法; 类似实现了面向对象中 ...

兵马未动,粮草先行; 同理,项目开发过程中经常会出现接口未出, 前端页面已搭建完毕的情况;此时为了提高前端的开发效率,解放生产力,我们 FE 可以按照预定的接口文档做一些接口模拟的工作,等等后端小伙伴开发完接口后我们只需要替换一个接口基地址即可...

记一次vue 组件中使用 transition 和 transition-group 设置过渡动画,总结来说可分为分为 name 版, js 钩子操作类名版, js 钩子操作行内样式版...

开发过程少不了会遇到给某个状态设置过期时间的需求,例如:进入页面有个默认弹窗,用户关闭之后在 1 小时之内再次打开不能再弹; 面对这样需求我们首先想到的是需要设置一个变量去控制弹窗的隐藏(因为默认是开启的), 如何去保证这个变量的有效时间呢? 这里就涉及到数据的持久化,前端数据持久化可以理解为客户端数据的持久化...

vue3.0以后 slot 和 slot="xxx",slot-scope 的方式会被废弃...新的用法slot, v-slot:xxx || v-slot:default, v-slot:xxx="slotProps"简写: v-slot:header 可以被重写为 #header

为什么要做一个自定义video组件, 主要是浏览器原生的video的颜值比较拉垮, 难以满足c端用户的审美要求, 也无法吸引用户去使用. 故笔者在原生video的基础上, 给它套了一层外衣, 实现了一版自定义的视频播放器组件

最近在写一个自定义播放器, 写之前我们肯定要把播放器的属性和方法全部过一遍,知彼知己,方能百战不殆嘛...后面会把自己写的播放器和踩过的一些坑也上传上来

以新浪微博为例: 其协议为 sinaweibo://splash; 这些协议需要自己去收集,或者去官方查询; 有些App分IOS和Android; 有些应用又不分;这个根据终端做处理即可

目前我所理解的前端工程化, 顾名思义, 就是让前端项目具备工程特性: 满足规范化,流程化,自动化等要求, 随着大前端时代下前端发展的速度越来越快, 项目也日渐复杂起来, 前端项目管理也越来庞杂, 造成项目维护性差,开发效率低等弊病吧; 在接手了公司前端业务一段时间后, 也感觉存在这些问题, 目前正在尝试将前端工程化这一...

由于最近一个移动端项目中许多地方有滚动需求, 横向,纵向的都有,所以就基于better-scroll封装了一个通用的滚动组件,期间也踩了一些坑,有时候会滚动失效,初始化的时候就不能滚动等等...better-scroll地址: [链接]

现在，很多网站采取各种各样的措施来反爬虫，其中之一就是使用验证码。当我们访问网页时，必须先通过验证码才能够访问页面。下面我们便来讲2种验证码的识别方式和一些思路。当然我们也可以直接使用付费的打码平台，那样可以增加识别的准确度，毕竟出了钱的嘛。哈哈！

金三银四, 又到了一年一度的跳槽季, 相信大家都在准备自己面试笔记, 我也针对自己工作中所掌握或了解的一些东西做了一个目录总结,方便自己复习; 详细内容会在之后一一对应地补充上去(有些在我的个人主页笔记中也有相关记录), 这里暂且放一个我的面试知识点目录; 大家有兴趣可以自己根据目录去扩展, 欢迎在评论下方指点一...

在阮一峰老师的书中的说法是: Generator 函数有多种理解角度。语法上，首先可以把它理解成，Generator 函数是一个状态机，封装了多个内部状态。执行 Generator 函数会返回一个遍历器对象,也就是说，Generator 函数除了状态机，还是一个遍历器对象生成函数。返回的遍历器对象，可以依次遍历 Generator 函数内部的每一个状...

写在前面: 第一遍学Promise时, 只是大概过了一遍, 感觉学的不够深入, 这一篇算是对之前的一个总结吧. Promise在ES6中也属于一个较难理解的一部分; 所以在学习一个比较难理解的知识点时, 我们可以围绕这个知识点进行展开,逐个去理解.

封装: 提供属性和方法的权限管理, 只对外暴露接口, 具体的功能在内部实现 继承: 子类继承父类的方法和属性, 可以抽离公共代码,减少代码冗余 多态: 同一个接口在子类中的不同的实现, 可以对父类中方法进行扩展