技巧（赞美面试官研究的比较深）

1、渲染机制

什么是DOCTYPE及作用？

DTD（文档类型定义）是一系列的语法规则，用于定义文件类型。浏览器会根据它来判断文档类型，决定使用何种协议来解析以及切换浏览器模式；

DOCTYPE用来声明文档类型和DTD规范用于文件的合法性验证，如果不合法解析就会报错

html5：<!DOCTYPE html> html4.01分严格和宽松模式

浏览器的渲染过程？

1）解析html，解析css

2）将html，css整合在一起

3）生成renderTreee

4）渲染

重排Reflow？

DOM结构中各个元素都有自己的盒子，这些都需要浏览器根据各种样式来计算结果将元素放到它出现的位置，这个过程称之为reflow。

触发Reflow：DOM节点发生变化，css样式修改，窗口发生改变，修改字体等

重绘Repaint?

将DOM的按照计算的属性，特性呈现再页面上（可以将要操作的节点放在一个虚拟节点，一次append避免多次Repaint）

2、js运行机制

如何理解单线程？

在同一时间，只能做一件事

什么是任务队列？

同步任务和异步任务，同步任务会优先执行，异步任务会放到队列里，等同步任务执行完才执行

异步任务：setTimeout、setInterval、DOM事件、promise

什么是Event Loop？

1、运行栈

2、异步队列

3、将运行栈的任务执行完，然后去将队列里的任务放入运行栈中执行，执行完了。如此循环至队列为空

3、页面性能

1、资源压缩合并，减少http请求

2、非核心代码异步加载

1）动态加载脚本

2）async

3）defer

4）按需加载

3、浏览器缓存

缓存的分类：

1）强缓存(直接拿来用)

Expires

Cache-Control

2）协商缓存（不确定可以用，要上服务器询问）

Last-modified If-Modified-Since

Etag If-None-Match

4、使用CDN

5、预解析DNS

<meta http-equiv="x-dns-prefetch-control" content="on">

4、错误监控

　　前端错误的分类

　　　　即时运行错误：代码错误

　　　　资源加载错误

　　错误的捕获方式

　　　　即时运行错误

　　　　try catch

　　　　window.onerror

　　　　资源加载错误

　　　　　　object.onerror

　　　　　　performance.getEntries()

　　　　　　Error事件捕获

　　　　跨域的js运行错误如何捕获？

　　　　　　1）在script标签增加crossorigin属性

　　　　　　2）设置js响应头Access-Control-Allow-origin:*

　　上报错误的原理

　　　　1）采用Ajax通信的方式上报

　　　　2）通过image对象上报

面试视频知识点整理1-12（渲染机制，js运行机制，页面性能，错误监控）的更多相关文章

  1. 面试 09-02.js运行机制：异步和单线程

    09-02.js运行机制:异步和单线程 #前言 面试时,关于同步和异步,可能会问以下问题: 同步和异步的区别是什么?分别举一个同步和异步的例子 一个关于 setTimeout 的笔试题 前端使用异步的 ...

  2. 从浏览器多进程到JS单线程，JS运行机制的一次系统梳理

    前言 见解有限,如有描述不当之处,请帮忙及时指出,如有错误,会及时修正. ----------超长文+多图预警,需要花费不少时间.---------- 如果看完本文后,还对进程线程傻傻分不清,不清楚浏 ...

  3. 从浏览器多进程到JS单线程，JS运行机制最全面的一次梳理

    前言 来源:https://dailc.github.io/2018/01/21/js_singlethread_eventloop.html 见解有限,如有描述不当之处,请帮忙及时指出,如有错误,会 ...

  4. 如何通过setTimeout理解JS运行机制详解

    setTimeout()函数:用来指定某个函数或某段代码在多少毫秒之后执行.它返回一个整数,表示定时器timer的编号,可以用来取消该定时器. 例子 ? 1 2 3 4 5 console.log(1 ...

  5. Js 运行机制 event loop

    Js - 运行机制 (Even Loop) Javascript 的单线程 - 引用思否的说法: JavaScript的一个语言特性(也是这门语言的核心)就是单线程.什么是单线程呢?简单地说就是同一时 ...

  6. 浅谈java编译机制和运行机制

    源文件和字节码的组成方式 源文件: 拓展名后跟java的文件即java的源文件. Java 源码编译由以下三个过程组成: 1.分析和输入到符号表 2.注解处理 3.语义分析和生成class文件 流程图 ...

  7. js 运行机制

    <script> console.log(1) setTimeout(function(){ console.log(3) },0) console.log(2) </script& ...

  8. Js 运行机制 (重点!!)

    一.引子 本文介绍JavaScript运行机制,这一部分比较抽象,我们先从一道面试题入手: 这一题看似很简单,但如果你不了解JavaScript运行机制,很容易就答错了.题目的答案是依次输出1 2 3 ...

  9. js 运行机制简单了解

    一.如何理解 JS 的单线程? JavaScript语言的一大特点就是单线程,也就是说,同一个时间只能做一件事.那么,为什么JavaScript不能有多个线程呢?这样能提高效率啊. JavaScrip ...

  10. 【Android 面试基础知识点整理】

    针对Android面试中常见的一些知识点整理,Max 仅仅是个搬运工.感谢本文中引用文章的各位作者,给大家分享了这么多优秀文章.对于当中的解析,是原作者个人见解,有错误和不准确的地方,也请大家积极指正 ...

随机推荐

  1. Qt 3D示例——cube

    Qt 3D官方示例 cube的3D演示,一个纯C++的项目.虽然QML示例比较炫,但是要深入理解还是得从C++例子入手. 从MainWidget.show入口.一步步可以跟踪到initializeGL ...

  2. 论文阅读： CCF A 2022 MVD: 基于流敏感图神经网络的内存相关漏洞检测 （ICSE）

    Motivation: 内存相关漏洞会导致性能下降和程序崩溃,严重威胁到现代软件的安全性. 静态分析方法使用一些预定义的漏洞规则或模式来搜索不正确的内存操作,然而,定义良好的漏洞规则或模式高度依赖于专 ...

  3. Appium-TouchAction类与MultiAction类（控件元素的滑动、拖动，九宫格解锁，手势操作等）

    文章转自:https://www.cnblogs.com/lfr0123/p/13679568.html swipe一般用于对页面进行上下左右滑动操作,但自动化过程中还会遇到其他情况,如对控件元素进行 ...

  4. nginx客户端真实IP配置

    https://www.cnblogs.com/kevingrace/p/8269955.html include mime.types; default_type application/octet ...

  5. Unity简单使用 Addressables远端打包流程

    跟着一步步操作即可 1.先打开一个unity项目 2.导入插件资源包地址,点击如图片所示 3.最后点击导入就行了也就是第三步 Install 4.这是在点击 Window 安装后Window/多了一个 ...

  6. WARN hdfs.DataStreamer: Caught exception

    在向hdfs上传文件的时候,报了这么一个错: Exception in thread "main" java.lang.RuntimeException: org.apache.h ...

  7. 11、java环形单链表解决约瑟夫问题

    环形单向链表:守卫连接的一个单向链表,每个节点中有其变量和一个指针指向下一个节点.头节点可有可无,此处写的没有头节点. 创建,先创建一个没有数据的first节点表示整个链表的第一个节点 添加,此处的添 ...

  8. Jquery 简单实现demo

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  9. selenium执行下载多个文件操作，谷歌浏览器弹出"xxx想要下载多个文件"的处理方法

    背景:   使用selenium框架,批量下载多个目录的不同文件,而下载多个文件时,浏览器会弹出如下窗口 解决方案有2个:1.代码定位到元素并点击[允许].2.修改浏览器的设置,使其能够拥有自动下载的 ...

  10. [部署日记]GO在Visual Studio Code初次运行时提示The "gopls" command is not available. Run "go get -v golang.org/x/tools/gopls" to install.

    本以为VSC在商城装上插件后就能拎包入住,F5的时候我当场好家伙 于是无脑Install... Installing github.com/nsf/gocode FAILED Installing g ...