vimdiff 配置

Vim-Practice Git Tmux Vim Diff

vimdiff 命令相当于 vim -d a.txt b.txt,用来查看两个文件的 diff。 可以通过 :highlight 命令来进行 diff 配色,也可以将 vimdiff 设置到 Git 的 diff 工具。

百分号编码与 encodeURIComponent

encodeURIComponent UTF-8 URL GB2312

百分号编码、encodeURIComponent、URL encode 其实都是指在 URL 参数中转义任意字符。 在百分号编码中,每个字符被编码成3个字符,包括第一个起始的 %, 以及接着的两个字符表示 16 进制的一个字节。 比如空格字符(00100000)编码后的结果为 %20

TL;DR

  • URL 是 URI 的一种形式。
  • URI 的合法字符包括18个保留字符和66个非保留字符
  • application/x-www-form-urlencoded 中空格编码为 +
  • decodeURIComponent() 对非 UTF-8 的源会抛出 URIError: URI malformed

内联和外链脚本的性能实验

Chrome DNS HTTP JavaScript inline 性能 缓存

HTML 中引入 CSS 和 Script 是为了分离内容、样式和脚本。但有时出于性能考虑可能会内联(一部分)脚本和样式。内联可以减少请求,但外链可以更好地利用HTTP 缓存。 本文通过实验来验证这两种脚本引入方式的渲染性能差别,同时考虑文件数目、网络耗时的影响。

TL;DR

推荐总是使用外链脚本并尽可能利用 HTTP 缓存。除了整体性能较高外,外链脚本符合关注点分离的原则维护性更好。为减小没有缓存时的请求数量,可按更新频率合并脚本文件。 以下是实验结论:

  • 不考虑网络耗时的情况下,内联脚本的 HTML 解析和渲染时间更长,达到可交互状态也需要更长的时间。
  • 无缓存的情况下文件数目的增多会急剧增加渲染时间,但只要合适地使用缓存,即使文件数目非常多也不会影响渲染性能。
  • 在各种网络情况下即使没有缓存,少量的外链和内联脚本的渲染性能表现非常相近。

Fetch API 简介

CORS Chrome Cookie PWA 缓存 跨域 兼容性 Service-Worker

随着 PWA 进入人们的视野,Fetch 作为除了 AJAX 之外的第二个 JavaScript HTTP API 开始引起人们的关注。 Service Worker 中通常利用该 API 进行真正的网络请求并应用相应的缓存策略。 本文简要介绍 Fetch API 的使用,Service Worker 与 Window 中的实现差异,以及跨域 Fetch 的问题。

目前 Web 异步应用都是基于 XMLHttpRequest/ActiveXObject 实现的, 这些对象不是专门为资源获取而设计的,因而它们的 API 非常复杂,同时还需要开发者处理兼容性问题。 虽然开发者普遍使用 $.ajax() 这样的上层包装,但 Fetch API 意在提供更加方便和一致的原生 API, 同时统一 Web 平台上的资源获取行为,包括外链脚本、样式、图片、AJAX 等等。

上一页 下一页