图床加载失败？我们来看看发生了什么 最近在学习 fluuter，所以开发了一款应用，起名为：VVEX，数据都是通过模拟请求，解析 html 结构拿到的。今天在手机上浏览主题时，发现在详情页会出现加载时白屏的情况，如下图。很明显可以判断是图片加载异常导致的问题。打开编辑器 🔨 ，复现一下问题，很明显我们图片资源出了点有问题flutter: https://tutu.to/ttt_tvI99C.pngflutter: Excep...

• 1k
• 4min

360°看车实现方案 最近在业务需求中，有360°看车的需求，即左右左右滑动鼠标实现正、侧、后方，多视角看车，增加意向用户对于车辆外观的了解，提高购买意向（毕竟比三张轮播图更生动不是）。经过调研，发现市面上类似场景的实现都是36张图，每10°切换一张，达到360°的效果，36 = 360 /10，同时也发现，目前市面上开源框架不适用于业务需求，主要还是可定制度太低，所以决定自己实现（好像也没其他办法了）。下面将从...

• 1.4k
• 5min

cookie相关 由于HTTP本身是无状态的，服务端无法区分谁是谁，所以有了cookie的概念。cookie的作用之一也就是区分用户，存储用户信息。cookie来去cookie由服务端在响应头中通过set-cookie下发，浏览器接收到后，会自动将cookie中的字段保存起来，下次再发起请求时会自动在请求头中携带cookiecookie的属性Domain：cookie的作用域，默认 /从A域名得到的cooki...

• 325
• 1min

网页性能指标 几个关键词：FCP、LCP、TTI、FID、TBT什么是FCP首次内容绘制 (FCP) 指标测量页面从开始加载到页面内容的任何部分在屏幕上完成渲染的时间。对于该指标，”内容”指的是文本、图像（包括背景图像）、svg元素或非白色的canvas元素。（白屏时长）FCP时长的定义要在 JavaScript 中测量 FCP，您可以使用绘制计时 API。以下示例说明了如何创建一个Performance...

• 976
• 3min

浏览器缓存 浏览器缓存主要分为强缓存、协商缓存、启发式缓存，下面进行详细说明。当我们首次向服务端发起请求时，由于本地没有缓存结果及标识，所以直接向服务端发起请求，服务器会在响应报文的HTTP头中增加缓存标识，客户端即浏览器会根据缓存标识来决定是否缓存结果，需要缓存则将请求结果和缓存标识存入浏览器缓存。在每次在发起请求时，都会在浏览器缓存中先检查是否有请求结果以及缓存标识根据有无请求结果及缓存标识，做以下...

• 1.5k
• 5min

关于HTTP HTTP 又称超文本传输协议，自从1991年发布初始版本0.9，现如今已经到了HTTP 3.0。在这里做个笔记，来记录一下HTTP的前世今生HTTP 0.9/1.0HTTP 0.9不支持请求头，只支持GET方法。HTTP 1.0 在0.9的基础了，增加了一些变化：请求中加入的版本号，例如 HTTP/1.0增加了请求头&响应头增加了HTTP Status Code 当然，业务...

• 2.7k
• 9min

简单实现一个Promise 简单实现一个Promise A+ 规范的Promise首先，了解一下Promise的基本用法const promise = new Promise((resolve, reject) => { if() { resolve('成功回调') }else{ reject('失败回调...

• 1.4k
• 6min

看我来实现一个webpack loader loader的基本概念在webpack中，loader本质是一个函数，在我们执行文件操作时，会通过该函数对接收到的内容进行转换，返回转换后的结果。因为 Webpack 只支持 JavaScript 文件，所有有的时候，loader也对其他类型的文件进行转译处理，转换为 Webpack 支持的文件。实现一个同步的 loader在实现之前，我们先看一下什么是同步loader：默认创建的Loade...

• 1.4k
• 6min

Tree shaking是什么？ 一直以来都知道在 webpack 打包优化中，有 tree shaking（别名：树摇）这一项优化，却不知道它的工作机制和原理，趁着今天复习知识的空学习一下tree shaking 是什么？tree shaking，别名：树摇，最早是由Rollup实现。根据字面意思我们可以把它理解成一种工具，可以“摇动”我们的 JS 文件，将其中用不到的代码“摇”掉，属于性能优化的一部分。具体到实际场景中来...

• 316
• 1min

webpack一二三讲 webpack是什么？webpack是一个模块打包工具，可以使用它管理项目中的模块依赖，并编译输出模块所需的静态文件。它可以很好地管理、打包开发中所用到的HTML,CSS,JavaScript和静态文件（图片，字体）等，让开发更高效。对于不同类型的依赖，webpack有对应的模块加载器，而且会分析模块间的依赖关系，最后合并生成优化的静态资源webpack基本功能和工作原理代码转换：TypeS...

• 3.1k
• 11min