04 2021 档案
摘要：在前面的文章中，我们介绍了 setTimeout 是如何结合渲染进程的循环系统工作的，那本篇文章我们就继续介绍另外一种类型的 WebAPI —— XMLHttpRequest。 自从网页中引入了 JavaScript，我们就可以操作 DOM 树中任意一个节点，例如隐藏 / 显示节点、改变颜色、获得或
阅读全文
摘要：一、XSS 攻击的介绍 在开始本文之前，我们先提出一个问题，请判断以下两个说法是否正确： 1、XSS 防范是后端 RD（研发人员）的责任，后端 RD 应该在所有用户提交数据的接口，对敏感字符进行转义，才能进行下一步操作。 2、所有要插入到页面上的数据，都要通过一个敏感字符过滤函数的转义，过滤掉通用的
阅读全文
摘要：今天访问网站一篇文章，弹出一个alert()，我就意识到网站被人拿来测试XSS攻击了。 一、XSS攻击原理 XSS到底是如何攻击、我们又应该如何防范的呢？ XSS攻击主要是针对表单的input文本框发起的，比如有一个文本框输入： <script>alert("xss");</script> <img
阅读全文
摘要：前面我们介绍了页面中的事件和消息队列，知道了浏览器页面是由消息队列和事件循环系统来驱动的。 那在接下来的两篇文章中，我会通过 setTimeout 和 XMLHttpRequest 这两个 WebAPI 来介绍事件循环的应用。这两个 WebAPI 是两种不同类型的应用，比较典型，并且在 JavaSc
阅读全文
摘要：最初我们讲到了每个渲染进程都有一个主线程，并且主线程非常繁忙，既要处理 DOM，又要计算样式，还要处理布局，同时还需要处理 JavaScript 任务以及各种输入事件。要让这么多不同类型的任务在主线程中有条不紊地执行，这就需要一个系统来统筹调度这些任务，这个统筹调度系统就是我们今天要讲的消息队列和事
阅读全文
摘要：前面我们已经花了很多篇幅来介绍 JavaScript 是如何工作的，了解了这些内容能帮助你从底层理解 JavaScript 的工作机制，从而能帮助你更好地理解和应用 JavaScript。 今天这篇文章我们就继续 “向下” 分析，站在 JavaScript 引擎 V8 的视角，来分析 JavaScr
阅读全文
摘要：一、浏览器是如何下载资源的 1、同步的JS阻塞下载 HTML 在解析的过程中遇到同步的 script 会卡住 DOM 解析，这个知识点我相信大家应该都知道。 <!DOCTYPE html> <html lang="en"> <body> <script>console.log(1)</script>
阅读全文
摘要：一、问题背景 异步 HTTP 请求在现代 web 应用中可以说是随处可见。为了更好的用户体验，05 年出现了 Ajax，支持不刷新页面实现局部更新。 Ajax 支持同步和异步两种方式，但是大家基本上只用异步方法，因为发送同步请求会让浏览器进入暂时性的假死状态，特别是请求需要处理大数据量、长时间等待的
阅读全文
摘要：在日常生活中，二维码出现在很多场景，比如超市支付、系统登录、应用下载等等。了解二维码的原理，可以为技术人员在技术选型时提供新的思路。对于非技术人员呢，除了解惑，还可以引导他更好地辨别生活中遇到的各种二维码，防止上当受骗。 在扫码的过程中，大家可能会有疑问：这二维码安全吗？会不会泄漏我的个人信息？更深
阅读全文
摘要：一、小程序基础知识 小程序是基于WEB规范，采用HTML、CSS和JS等搭建的一套框架，微信官方给它们取的名字：WXML、WXSS，但本质上还是在整个WEB体系之下构建的。WXML说到底就是xml的一个子集。WXML采用微信自定义的少量标签WXSS，大家可以理解为就是自定义的CSS。实现逻辑部分的J
阅读全文
摘要：在网络请求中，我们在使用到某些资源比如：图片，JS，CSS 等等，在执行之前总需要等待资源的下载，如果我们能做到预先加载资源，那在资源执行的时候就不必等待网络的开销，这时候就轮到 preload 大显身手的时候了。 一、preload 提前加载 preload 是一个新的 Web 标准，在页面生命周
阅读全文
摘要：一、在页面关闭时，前端上传监控数据的5个解决方案 1、同步XMLHttpRequest const data = JSON.stringify({ time: performance.now() }); var xhr = new XMLHttpRequest(); // 第三个参数false，表示
阅读全文
摘要：最近看到一篇文章写diff算法实现（深度剖析：如何实现一个 Virtual DOM 算法 #13），研究了一下写的确实不错，转载如下： 本文会教你怎么用 300~400 行代码实现一个基本的 Virtual DOM 算法，并且尝试尽量把 Virtual DOM 的算法思路阐述清楚。希望在阅读本文后，
阅读全文
摘要：需求背景：自定义微信小程序导航栏。 因为项目需要，要实现如京东小程序类似的搜索导航栏（下图所示搜索框在导航栏中）。参考了官方API最终实现了该有的效果，顺便把此次实现的思路和代码记录下来。 一、拆解分析 按照正常的导航栏拆解来进行计算自定义导航栏的高度。 根据下图所示可以得到导航栏的高度等于：手机状
阅读全文
摘要：面试题： 1、批量请求：要实现批量请求，而且并不需要按顺序发起请求（如果需要按顺序可以存入队列中，按优先级则可以存入优先队列中），所以这里我们存入数组中即可，然后进行遍历，取出数字中的每一项丢去fetch中进行调用。 2、可控制并发度：控制并发数，一个简单的办法就是对数组进行切片，分成一段一段，完成
阅读全文
