![](https://img-blog.csdnimg.cn/20201014180756922.png?x-oss-process=image/resize,m_fixed,h_224,w_224)
大前端
文章平均质量分 75
大杂烩
灯灯登登
杂学派,热衷各种技术
展开
-
重绘和回流(重排/重构)
浏览器的渲染机制 渲染引擎根据标签生成对应的结点,并构建DOM树(解析)。 解析渲染树,解析对应CSS样式的文件信息(JS定义的样式和CSS文件中的样式),构建生成渲染树,其中渲染树的每个结点都有自己的样式信息(render tree)PS:渲染树中不包含隐藏的结点,比如head,和display:none 布局渲染树(根节点递归),计算出每个结点的所在位置,最终绘制渲染树 重绘(repaint and redraw) 绘制 当盒子的位置、大小以及其他的CSS属性确定下来之后,浏览器就把结点根据这些特性原创 2021-03-11 23:52:29 · 237 阅读 · 0 评论 -
nginx配置spa(单页面应用)
安装nginx 我这里使用的ubuntu的系统,使用以下命令安装nginx apt install nginx -y 上传 把我们的单页面应用上传到我们的服务器,比如我的单页面应用的文件结构为 把这些放置到sweeper-js的文件夹里面 上传到服务器用户的问价夹中,我的目录为/ubuntu/sweeper-js 配置nginx服务 在/etc/nginx/conf.d/中,新建一个sweeper.conf的文件,里面的内容为 server{ listen 3020; //监听的端口号 serv原创 2021-03-01 18:20:41 · 791 阅读 · 0 评论 -
前端知识体系【下】
1.开发环境 1.1 git 见廖雪峰的Git教程 1.2 调试工具 1.3 抓包 1.4 webpack babel 把ES6+的js语法转化为ES5 1.5 linux常用命令 …远程链接软件mobaXterm,可连接远程服务器 2.运行环境 2.1 网页加载过程 题目 从输入url到渲染出页面的整个过程 window.onload和DOMContentLoaded的区别 知识点 加载资源的形式 html代码 媒体文件,图片,视频 js,css文件 加载资源的过程 DNS解析:域名到-&原创 2021-02-24 10:18:57 · 71 阅读 · 0 评论 -
Echarts实现带时间轴的疫情地图
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <script src="./echarts.min.js"></script> <script src="./jquery.min.js...原创 2020-02-12 22:31:11 · 5092 阅读 · 2 评论 -
前端知识体系【上】
原则 找准知识体系,刻意练习,及时反馈 刷题要形成结构化的知识范围,涵盖所有的知识点,结构化、有组织、易拓展 围绕这几个方面解决: W3C标准(应用) 2. ECMA262标准(定义)3. 开发环境 4.运行环境 常见的几个问题 window.onload和DOMContentLoaded区别?script为什么放在头部,为什么放在body(页面加载) JS创建10个<a>标签,点击弹出对应的序号1~10。(闭包,作用域) 手写节流throttle和防抖debounce(体验,性能优化)原创 2021-02-22 16:20:51 · 104 阅读 · 0 评论 -
学成在线demo练习
布局 分析网站的布局部分,有header,banner 具体流程 header制作 h5部分代码 <!-- 头部盒子 --> <div class="header w"> <!-- logo --> <div class="logo"> <img src="images/logo.png" alt="#"> </div> <!-原创 2021-02-18 10:09:19 · 130 阅读 · 0 评论