发表于 | 分类于
这里就不再说 webpack 打包的基础功能啦，说说一些比较实用的功能和技巧，基于 webpack3.x。 想学习 webpack 基础打包配置的童鞋可以访问上一篇文章：webpack 基础使用 提取公共代码当前主流的开发模式都是模块化开发？使用模块化开发的时候，一般都会有其他模块依赖于公共模块的这样的一个过程，这些公共的代码模块就是我们所要提取的公共代码。 提取公共代码可以： 减少代码冗余 提高页面加载速度 怎么提取公共代码？ 使用 webpack 自带的 webpack.optimize.CommonsChunkPlugin 插件即可（webpack4.0以后的版本已由optimization.splitChunks和optimization.runtimeChunk代替）: 12345{ ...
阅读全文 »

发表于 | 分类于
通用首部字段是指，请求报文和响应报文双方都会使用的首部。 6.3.1 Cache-Control通过指定首部字段 Cache-Control 的指令，就能操作缓存的工作机制。 图：首部字段 Cache-Control 能够控制缓存的行为 指令的参数是可选的，多个指令之间通过“,”分隔。首部字段 CacheControl 的指令可用于请求及响应时。Cache-Control: private, max-age=0, no-cache Cache-Control 指令一览，可用的指令按请求和响应分类如下： 表示是否能缓存的指令： public 指令，Cache-Control: public，当指定使用 public 指令时，则明确表明其他用户也可利用缓存。 private 指令，Cache-Control: ...
阅读全文 »

发表于 | 分类于
6.1 HTTP 报文首部HTTP 协议的请求和响应报文中必定包含 HTTP 首部，首部内容为客户端和服务器分别处理请求和响应提供所需要的信息。图：HTTP 报文的结构 报文首部由几个字段构成。 HTTP 请求报文：在请求中，HTTP 报文由方法、URI、HTTP 版本、HTTP 首部字段等部分构成。 图：请求报文 下面的示例是访问 http://hackr.jp 时，请求报文的首部信息： HTTP 响应报文：在响应中，HTTP 报文由 HTTP 版本、状态码（数字和原因短语）、HTTP 首部字段 3 部分构成。 图：响应报文 以下示例是之前请求访问 http://hackr.jp/ 时，返回的响应报文的首部信息： 在报文众多的字段当中，HTTP 首部字段包含的信息最为丰富。首部字段同时存在于请求和响应报文 ...
阅读全文 »

发表于 | 分类于
5.1 用单台虚拟主机实现多个域名一台 Web 服务器可搭建多个独立域名的 Web 网站，也可作为通信路径上的中转服务器提升传输效率。 HTTP/1.1 规范允许一台 HTTP 服务器搭建多个 Web 站点。即使物理层面只有一台服务器，但只要使用虚拟主机的功能，则可以假想已具有多台服务器。 在互联网上，域名通过 DNS 服务映射到 IP 地址（域名解析）之后访问目标网站。可见，当请求发送到服务器时，已经是以 IP 地址形式访问了。所以，如果一台服务器内托管了 www.tricorder.jp 和 www.hackr.jp 这两个域名，当收到请求时就需要弄清楚究竟要访问哪个域名。 在相同的 IP 地址下，由于虚拟主机可以寄存多个不同主机名和域名的 Web 网站，因此在发送 HTTP 请求时，必须在 Host ...
阅读全文 »

发表于 | 分类于
4.1 状态码告知从服务器端返回的请求结果图：响应的状态码可描述请求的处理结果 状态码如 200 OK，以 3 位数字和原因短语组成。数字中的第一位指定了响应类别，后两位无分类。响应类别有以下 5种。 只要遵守状态码类别的定义，即使改变 RFC2616 中定义的状态码，或服务器端自行创建状态码都没问题。 仅记录在 RFC2616 上的 HTTP 状态码就达 40 种，若再加上WebDAV（Web-based Distributed Authoring and Versioning，基于万维网的分布式创作和版本控制）（RFC4918、5842） 和附加 HTTP 状态码（RFC6585）等扩展，数量就达 60 余种。别看种类繁多，实际上经常使用的大概只有 14 种。接下来，我们就介绍一下这些具有代表性的 14 ...
阅读全文 »

发表于 | 分类于
3.1 HTTP 报文用于 HTTP 协议交互的信息被称为 HTTP 报文。请求端（客户端）的HTTP 报文叫做请求报文，响应端（服务器端）的叫做响应报文。HTTP 报文本身是由多行（用 CR+LF 作换行符）数据构成的字符串文本。 HTTP 报文大致可分为报文首部和报文主体两块。两者由最初出现的空行（CR+LF）来划分。通常，并不一定要有报文主体。 图：HTTP报文结构 3.2 请求报文及响应报文的结构请求报文和响应报文的结构： 图：请求报文（上）和响应报文（下）的结构 例如： 图：请求报文（上）和响应报文（下）的实例 请求报文和响应报文的首部内容由以下数据组成： 请求行：包含用于请求的方法，请求 URI 和 HTTP 版本。 状态行：包含表明响应结果的状态码，原因短语和 HTTP 版本。 首部字段：包 ...
阅读全文 »

发表于 | 分类于
2.1 HTTP 协议用于客户端和服务器端之间的通信HTTP 协议和 TCP/IP 协议族内的其他众多的协议相同，用于客户端和服务器之间的通信。 请求访问文本或图像等资源的一端称为客户端，而提供资源响应的一端称为服务器端。 图：应用 HTTP 协议时，必定是一端担任客户端角色，另一端担任服务器端角色 在两台计算机之间使用 HTTP 协议通信时，在一条通信线路上必定有一端是客户端，另一端则是服务器端。 2.2 通过请求和响应的交换达成通信 图：请求必定由客户端发出，而服务器端回复响应 HTTP 协议规定，请求从客户端发出，最后服务器端响应该请求并返回。换句话说，肯定是先从客户端开始建立通信的，服务器端在没有接收到请求之前不会发送响应。 示例： 图：GET /index.htm HTTP/1.1和Host: h ...
阅读全文 »

发表于 | 分类于
1.1使用 HTTP 协议访问 WebWeb 页面根据 Web 浏览器地址栏中指定的URL，Web 浏览器从 Web 服务器端获取文件资源（resource）等信息，从而显示出 Web 页面。像这种通过发送请求获取服务器资源的 Web 浏览器等，都可称为客户端（client）。 Web 使用一种名为 HTTP（HyperText Transfer Protocol，超文本传输协议 ）的协议作为规范，完成从客户端到服务器端等一系列运作流程。而协议是指规则的约定。可以说，Web 是建立在 HTTP 协议上通信的。 1.2HTTP 的诞生1989 年 3 月，CERN（欧洲核子研究组织）的蒂姆 • 伯纳斯 - 李（Tim BernersLee）博士提出了一种能让远隔两地的研究者们共享知识的设想。基本理念是：借助多文 ...
阅读全文 »

发表于 | 分类于
webpack 简介webpack 是一个现代 JavaScript 应用程序的静态模块打包器(module bundler)。当 webpack 处理应用程序时，它会递归地构建一个依赖关系图(dependency graph)，其中包含应用程序需要的每个模块，然后将所有这些模块打包成一个或多个 bundle。 功能进化 Webpack V1（2014.2.20） 编译、打包 HMR(模块热更新) 代码分割 文件处理(loader、plugin) Webpack V2（2017.1.18） Tree Shaking(在项目中没有实际运用的代码会被删除，打包体积更小) ES module 动态Import Webpack V3(2017.6.19) Scope Hoisting(作用域提升) Magic ...
阅读全文 »

发表于 | 分类于
这两天在公司协助切了一个门户网站的页面，用户在第一次登陆网站的时候明显感觉速度不够快，需要根据当前网速相应几秒。马上想到了把网站所有加载的图片在不失真的情况下进行了压缩：这里向大家推荐一个在线png,jpg图片压缩的网站：TinyPNG 基本可以把图片压缩50%作用，图片颜色种类越少图片的可以压缩的越小。 在压缩完图片之后，感觉网站还是不够快，然后决定再用用懒加载，把吧比较大的几张图片和banner的后面几张图片延迟加载。开始想用原来用过的现成的插件：lazy-load 不过后来觉得不想引用那么多Js文件，所以最后自己写了一个，下面是demo，不足之处，还望指正： HTML：12345678910111213141516171819202122232425262728<!DOCTYPE html>& ...
阅读全文 »