随笔分类 - JavaScript
es5、es6、jquery、node、express、koa
摘要：subscribe.js 1 (function(){ 2 class Subscribe { 3 constructor() { 4 // 事件池 5 this.$pond = [] 6 } 7 // 追加事件 8 add(func) { 9 // 事件去重 10 const flag = thi
阅读全文
摘要：一、手机的分辨率和手机浏览器的分辨率 首先我们得清楚，手机的分辨率和手机浏览器分辨率不是一个东西。 一般来说，我们使用的手机的分辨率远大于手机浏览器的分辨率。因为手机分辨率大会让手机显示的内容更细腻，比如消除图片的颗粒感；而手机浏览器分辨率小则是为了让用户对某些内容更好辨认，比如更大的文字，同时，这
阅读全文
摘要：Web Components 是一套不同的技术，允许您创建可重用的定制元素（它们的功能封装在您的代码之外）并且在您的web应用中使用它们。 作为开发者，我们都知道尽可能多的重用代码是一个好主意。这对于自定义标记结构来说通常不是那么容易 — 想想复杂的HTML（以及相关的样式和脚本），有时您不得不写代
阅读全文
摘要：一图解千愁： 先来试个一句话解释仨，当浏览器碰到 script 脚本的时候： <script src="外部.js"></script> 没有 defer 或 async，浏览器会立即加载并执行指定的脚本，“立即”指的是在渲染该 script 标签之下的文档元素之前，也就是说不等待后续载入的文档元素
阅读全文
摘要：谈到HTTPS, 就不得不谈到与之相对的HTTP。HTTP的特性是明文传输，因此在传输的每一个环节，数据都有可能被第三方窃取或者篡改，具体来说，HTTP 数据经过 TCP 层，然后经过WIFI路由器、运营商和目标服务器，这些环节中都可能被中间人拿到数据并进行篡改，也就是我们常说的中间人攻击。 为了防
阅读全文
摘要：什么是CSRF攻击？ CSRF(Cross-site request forgery), 即跨站请求伪造，指的是黑客诱导用户点击链接，打开黑客的网站，然后黑客利用用户目前的登录状态发起跨站请求。 举个例子, 你在某个论坛点击了黑客精心挑选的小姐姐图片，你点击后，进入了一个新的页面。 那么恭喜你，被攻
阅读全文
摘要：什么是 XSS 攻击？ XSS 全称是 Cross Site Scripting(即跨站脚本)，为了和 CSS 区分，故叫它XSS。XSS 攻击是指浏览器中执行恶意脚本(无论是跨域还是同域)，从而拿到用户的信息并进行操作。 这些操作一般可以完成下面这些事情: 窃取Cookie。 监听用户行为，比如输
阅读全文
摘要：我们首先来回顾一下渲染流水线的流程: 接下来，我们将来以此为依据来介绍重绘和回流，以及让更新视图的另外一种方式——合成。 回流 首先介绍回流。回流也叫重排。 触发条件 简单来说，就是当我们对 DOM 结构的修改引发 DOM 几何尺寸变化的时候，会发生回流的过程。 具体一点，有以下的操作会触发回流:
阅读全文
摘要：上一节介绍了浏览器解析的过程,其中包含构建DOM、样式计算和构建布局树。 接下来就来拆解下一个过程——渲染。分为以下几个步骤: 建立图层树(Layer Tree) 生成绘制列表 生成图块并栅格化 显示器显示内容 一、建图层树 如果你觉得现在DOM节点也有了，样式和位置信息也都有了，可以开始绘制页面了
阅读全文
摘要：完成了网络请求和响应，如果响应头中Content-Type的值是text/html，那么接下来就是浏览器的解析和渲染工作了。 首先来介绍解析部分，主要分为以下几个步骤: 构建 DOM树 样式计算 生成布局树(Layout Tree) 构建 DOM 树 由于浏览器无法直接理解HTML字符串，因此将这一
阅读全文
摘要：这是一个可以无限难的问题。出这个题目的目的就是为了考察你的 web 基础深入到什么程度。由于水平和篇幅有限，在这里我将把其中一些重要的过程给大家梳理一遍，相信能在绝大部分的情况下给出一个比较惊艳的答案。 这里我提前声明，由于是一个综合性非常强的问题，可能会在某一个点上深挖出非常多的细节，我个人觉得学
阅读全文
摘要：浏览器的本地存储主要分为Cookie、WebStorage和IndexedDB, 其中WebStorage又可以分为localStorage和sessionStorage。接下来我们就来一一分析这些本地存储方案。 Cookie Cookie 最开始被设计出来其实并不是来做本地存储的，而是为了弥补HT
阅读全文
摘要：三次握手和四次挥手是各个公司常见的考点，也具有一定的水平区分度，也被一些面试官作为热身题。很多小伙伴说这个问题刚开始回答的挺好，但是后面越回答越冒冷汗，最后就歇菜了。 见过比较典型的面试场景是这样的: 面试官：请介绍下三次握手求职者：第一次握手就是客户端给服务器端发送一个报文，第二次就是服务器收到报
阅读全文
摘要：最初，JavaScript 只能在 Web 浏览器中运行，但是随着 Node 的出现，现在 JavaScript 也可以在服务端运行。虽然我们可能知道应该在何时何地去使用它， 但是我们真的了解这些脚本执行的背后发生了什么吗？ 如果您觉得自己对 JavaScript 引擎有了一些了解的话，可以先给自己
阅读全文
摘要：'提升'是 JS 开发都经常接触的一个术语，如果你刚接触 JS，可能会遇到一些奇怪的行为，其中一些变量是随机undefined，会抛出ReferenceErrors 异常等等。提升通常被解释为将变量和函数放到作用域顶部，但实际上并不是这样，尽管行为看起来是这样的。 当 JS 引擎获取我们的代码时，它
阅读全文
摘要：前端普适性规范 黄金定律 不论有多少人共同参与同一项目，一定要确保每一行代码都像是同一个人编写的。 永远一致同一套编码规范，可以是这里列出的，也可以是你自己总结的。如果您发现本规范中有任何错误，敬请在问题中指正。 前端普适性规范 项目命名 项目名全部采用小写方式，以中划线分隔，禁止驼峰式命名。例如：
阅读全文
摘要：你可能在网上见过有人用 几个不同的字符写的各种稀奇古怪的 JavaScript 代码，虽然看起来奇怪，但是能正常运行！比如这个： (!(~+[])+{})[--[~+""][+[]]*[~+[]] + ~~!+[]]+({}+[])[[~!+[]]*~+[]] 复制代码 你猜运行结果是什么？你可以自
阅读全文
摘要：对于千万级的注册用户的门户项目是前端这块是怎么去实现的，自己在平常的工作中总结了一些经验，也是在不断的挫折中，不断演练的，希望总结出来给大家参考下，和大家一起探讨，一起进步。 一、门户设计一般会遇到哪些难点 （一）、首页打开时间太慢了 在开发一个门户到生产上线后，首页响应时间是检验门户整个系统架构以
阅读全文
摘要：可能大家都知道，js执行会阻塞DOM树的解析和渲染，那么css加载会阻塞DOM树的解析和渲染吗？接下来，我们就一起来分析一下。 原理解析 那么为什么会出现上面的现象呢？我们从浏览器的渲染过程来解析下。 不同的浏览器使用的内核不同，所以他们的渲染过程也是不一样的。目前主要有两个： webkit渲染过程
阅读全文
摘要：双十一剁手节过去了，大家应该在很多网页中看到了数字翻牌的效果吧，比如倒计时、 数字增长等。相信很多人都已经自己独立实现过了，我也在网上看了一些demo，发现HTML结构大多比较复杂，用了4个并列的标签来放置前后两个“牌”。本文就来讲解下，如何进一步精简HTML，让结构简单，让JS方法封装得易使用。先
阅读全文
浙公网安备 33010602011771号