学习笔记

白天 夜间 首页 下载 阅读记录
  我的书签   添加书签   移除书签

浏览器渲染流水线

浏览 147 扫码 分享 2022-11-10 20:52:41

若有收获,就点个赞吧

0 人点赞

上一篇:
下一篇:
  • 书签
  • 添加书签 移除书签
  • 无标题文档
  • 无标题文档
  • 无标题文档
  • 前端面试题之JavaScript篇
    • JS 类型:关于类型,有哪些你不知道的细节?
    • js
      • forEach() 怎么跳出循环
      • 前端视频直播技术及video.js在H5页面中的应用
      • javascript面试题
      • drag drop/offset client scroll
      • 代码题
        • 数组降维,去重
        • 211.手动实现数组 Reduce 方法
        • 262.实现一个JSON.stringify
        • 7.防抖节流
      • 13.介绍js全部数据类型,基本类型和引用类型的区别
      • 263.简单描述静态链接和动态链接的区别,并举例说明。
      • 259.js如何模拟实现方法的重载?
      • 229.extend.为什么扩展JS内置对象不是好的做法
      • JavaScript语言精粹
      • 无标题文档
      • 从页面 A 打开一个新页面 B,B 页面关闭(包括意外崩溃),如何通知 A
      • js new一个对象的过程,实现一个简单的new方法
      • for in 与 Object.keys 与 hasOwnProperty区别
      • 229. 说一下 JavaScript 的宿主对象和原生对象的区别?
        • 手写数组内置函数
        • 手写js函数内置api--bind | call | apply
      • 36.请用JS代码实现事件代理
      • 23.事件循环机制(node/浏览器)
      • JS 中的事件模型
      • 原型链
  • 项目实践
    • 移动端
      • 🥇 真机调试
      • 🥇 OAuth
    • 单点登录sso(Single Sign On)
  • 浏览器工作原理与实践
    • Cookie和Seesion
    • 同浏览器标签页间如何通信
    • 前端面试题
    • 开篇词 | 参透了浏览器的工作原理,你就能解决80%的前端难题
    • 宏观视角下的浏览器
      • 01 | Chrome架构:仅仅打开了1个页面,为什么有4个进程?
        • 浏览器都有哪些进程,渲染进程中都有什么线程?
      • 02 | TCP协议:如何保证页面文件能被完整送达浏览器?
        • TCP的滑动窗口
        • 作为前端的你了解多少tcp的内容
        • 260.DNS解析具体过程
        • 网络模型
        • tcp
      • 03 | HTTP请求流程:为什么很多站点第二次打开速度会很快?
      • 04 | 导航流程:从输入URL到页面展示,这中间发生了什么?
      • 05 | 渲染流程(上):HTML、CSS和JavaScript,是如何变成页面的?
        • 谈谈你对重绘和回流的理解?
        • URL到页面渲染过程
        • 浏览器渲染流水线
      • 06 | 渲染流程(下):HTML、CSS和JavaScript,是如何变成页面的?
    • 浏览器中的JS执行机制
      • 07 | 变量提升:JS代码是按顺序执行的吗?
      • 08 | 调用栈:为什么JS代码会出现栈溢出?
      • 09 | 块级作用域:var缺陷以及为什么要引入let和const?
        • 40.词法作用域 %26 this
      • 10 | 作用域链和闭包 :代码中出现相同的变量,JS引擎是如何选择的?
        • 说说你对闭包closure的理解?闭包使用场景?
      • 11 | this:从JS执行上下文的视角讲清楚this
        • 使用箭头函数(arrow functions) 的优点
    • V8工作原理
      • 12 | 栈空间和堆空间:数据是如何存储的?
      • 13 | 垃圾回收:垃圾数据是如何自动回收的?
        • 垃圾回收
        • 34.栈VS堆的区别,垃圾回收时栈VS堆?
      • 14 | 编译器和解释器:V8是如何执行一段JS代码的?
    • 浏览器中的页面循环系统
      • 15 | 消息队列和事件循环:页面是怎么“活”起来的?
      • 16 | WebAPI:setTimeout是如何实现的?
        • fiber核心原理拆解--屏幕刷新率、单链表、fiber执行阶段
      • 17 | WebAPI:XMLHttpRequest是怎么实现的?
      • 18 | 宏任务和微任务:不是所有任务都是一个待遇
        • 214. JS为什么要区分微任务和宏任务?
      • 19 | Promise:使用Promise,告别回调函数
      • 20 | async/await:使用同步的方式去写异步代码
    • 浏览器中的页面
      • 21 | Chrome开发者工具:利用网络面板做性能分析
      • 22 | DOM树:JS 是如何影响DOM树构建的?
      • 23 | 渲染流水线:CSS如何影响首次加载时的白屏时间?
      • 24 | 分层和合成机制:为什么CSS动画比 JS 高效?
      • 25 | 页面性能:如何系统地优化页面?
      • 26 | 虚拟DOM:虚拟DOM和实际的DOM有何不同?
      • 27 | 渐进式网页应用(PWA):它究竟解决了Web应用的哪些问题?
      • 28 | WebComponent:像搭积木一样构建Web应用
    • 浏览器中的网络
      • CDN技术详解
      • http
        • 计算机网络基础: 字节跳动最爱考的前端面试题
        • 计算机网络基础: 字节跳动最爱考的前端面试题
        • 244.什么是同源策略
        • post %26 get 请求
        • 状态码
          • 301 302 304
        • http请求的特征?
        • 前端性能优化-gzip压缩
        • 对于定长和不定长的数据,HTTP 是怎么传输的?
        • 深入理解幂等性
        • 浏览器本地存储的cookie了解多少
        • 浏览器的本地存储的WebStorage
        • 浏览器缓存机制(http缓存机制)-彻底理解
          • 浏览器缓存机制-强缓存的内容了解多少?
          • 浏览器缓存机制-协商缓存的内容了解多少
          • 浏览器缓存机制-缓存位置的内容能了解多少呢?
      • 29 | HTTP/1:HTTP性能优化
        • HTTP的长连接和短连接
      • 30|HTTP/2:如何提升网络速度?
      • 31|HTTP/3:甩掉TCP、TLS 的包袱,构建高效网络
    • 浏览器安全
      • 前端安全面试题
        • 跨域
          • 135.如何解决跨域问题?(js问题)
        • 19. 能不能说一说CSRF攻击?
        • 15.能不能说一说XSS攻击?
        • xss-csrf
      • 208.对称加密和非对称加密的区别和用处
      • 32 | 同源策略:为什么XMLHttpRequest不能跨域请求资源?
      • 33 | 跨站脚本攻击(XSS):为什么Cookie中有HttpOnly属性?
      • 34 | CSRF攻击:陌生链接不要随便点
        • SameSite cookie 的说明
      • 35 | 安全沙箱:页面和系统之间的隔离墙
      • 36 | HTTPS:让数据传输更安全
        • HTTP与HTTPS的区别
        • https
    • 结束语 | 大道至简
      • 第二季回归 | 这次我们来专门聊聊V8
      • 结课测试 | 这些浏览器的知识你都掌握了吗?
      • 加餐一|浏览上下文组:如何计算Chrome中渲染进程的个数?
      • 加餐二|任务调度:有了setTimeOut,为什么还要使用rAF?
      • 加餐三|加载阶段性能:使用Audits来优化Web性能
      • 加餐四|页面性能工具:如何使用Performance?
      • 加餐五 | 性能分析工具:如何分析Performance中的Main指标?
      • 加餐六|HTTPS:浏览器如何验证数字证书?
    • 图解 Google V8
      • 宏观视角
        • 开篇词 | 如何学习谷歌高性能 JavaScript 引擎V8?
        • 01 | V8是如何执行一段JS代码的?
        • 02 | 函数即对象:一篇文章彻底搞懂JavaScript的函数特点
        • 03 | 快属性和慢属性:V8是怎样提升对象属性访问速度的?
        • 04 | 函数表达式:涉及大量概念,函数表达式到底该怎么学?
        • 05|原型链:V8是如何实现对象继承的?
        • 06|作用域链:V8是如何查找变量的?
        • 07|类型转换:V8是怎么实现1+“2”的?
        • 08|答疑:如何构建和使用V8的调试工具d8?
        • 09 | 运行时环境:运行JS代码的基石
        • 10 | 机器代码:二进制机器码究竟是如何被CPU执行的?
  • 性能优化
    • webpack build 可以做哪些优化
    • cssText属性
    • 31.加快页面渲染速度有哪些方式?
    • 265.怎么理解图片懒/预加载?
    • 如何应用 Webpack 减少 Vue.js 包大小
    • defer/async异步加载script,提高前端性能
    • 前端页面性能优化的几种方式
    • 常用优化方法
    • 性能优化相关面试题
    • 前端高性能渲染大型树形结构组件(附全部代码React、Vue)
    • 256.一个 dom 必须操作几百次,如何优化?
    • 实现达到 60FPS 的高性能交互动画
  • 设计模式
    • 工厂模式
    • 单例模式
  • 移动端/跨平台
    • JSBridge原理
  • 重学前端-程劭非(winter)
    • 10 | 理论七:为何说要多用组合少用继承?如何决定该用组合还是继承?
    • 开篇词+学习路线+架构图 (3讲)
    • 浏览器实现原理与api
      • 浏览器:一个浏览器是如何工作的?(阶段一)
    • 模块四:前端综合应用 (5讲)
      • 搭建系统:大量的低价值需求应该如何应对?
      • 工具链:什么样的工具链才能提升团队效率?
      • 性能:前端的性能到底对业务数据有多大的影响?
    • 前端架构:前端架构有哪些核心问题?
    • 期末答疑(二):前端架构中,每个逻辑页面如何可以做到独立发布呢?
    • 加餐 | 前端与图形学
  • 213. 介绍你所理解的迭代器模式?
  • 258.异步请求,低版本 fetch 如何低版本适配?
  • 215. 讲一下你所了解的函数式编程
  • 前端监控
  • 远程加载动态组件/远程组件
  • Git
    • Git项目管理
  • chrome插件--响应拦截器
  • 聊聊 Node.js RPC(一)— 协议
  • 无标题文档
  • 无标题文档
  • 前端工程化
    • 微前端
      • 微前端的核心价值
      • 微前端
      • Why Not Iframe
      • 目标是最完善的微前端解决方案 - qiankun 2.0
      • 发布 @umijs/plugin-qiankun 2.3.0 - 全面拥抱 qiankun2
      • qiankun(微前端)快问快答
      • 你可能并不需要微前端
      • 擅长 node,熟悉 SSR,了解常用数据存储方案的选型与使用,有大型服务器开发经验者优先;
      • 🌟🌟🌟低代码开发平台设计初探索
    • 前端工程化-Mock Server:使用Node+json-server+mock.js搭建Mock Server
    • import %26 require
    • npm install 原理
    • npm几类依赖包
    • 常用工具
  • 杂记
  • 掘金收藏
  • 学习时间线
  • 网络应用设计模式
  • HTML5
    • HTML5 file API加canvas实现图片前端JS压缩并上传
    • 小tips:使用canvas在前端实现图片水印合成
    • 检测DOM尺寸变化JS API ResizeObserver简介
  • WebGL
    • 第一章 WebGL零基础快速入门
      • WebGL绘制一个点
暂无相关搜索结果!

    让时间为你证明

    展开/收起文章目录

    分享,让知识传承更久远

    文章二维码

    手机扫一扫,轻松掌上读

    文档下载

    请下载您需要的格式的文档,随时随地,享受汲取知识的乐趣!
    PDF文档 EPUB文档 MOBI文档

    书签列表

      阅读记录

      阅读进度: 0.00% ( 0/0 ) 重置阅读进度

        思维导图备注