动态页面

动态页面是什么?

我们之前处理的 HTML+CSS,都是静态的页面。
静态页面 就是不会变化的 .html 页面,如果修改了 .html 文件,对应的页面再被访问时,才会产生变化。
我们之前因为使用 FirstWeb,从而实现了 实时刷新 的功能,一旦源码发生变化,页面就自动刷新了。但这并不是动态页面,仍然是静态的,只是利用 Javascript、Websocket 实现的自动刷新而已。

动态页面特指使用后端(也就是服务器端)程序语言完成的,而 HTML、CSS 属于前端(浏览器端)语言。
一般来说,动态页面会因为连接到了数据库,或许因为时间不同、当前登录的用户不同、当前 URL 的参数不同而呈现出不同的页面内容。特殊的呢,倒是也可以将动态页面当做静态页面来使用,视具体情况而定,不必因为 动态静态 所谓的术语,而束缚了自己使用的场景。当然,一般网站上的页面,多数是动态页面,纯静态的倒不多。

对了,为什么要用动态页面,静态页面不够用吗?
我们举个例子,假设你的网站有 100 万个用户,每个用户都有自己的个人主页,个人主页很简单,就是显示 昵称。如果是静态的页面,是否需要对应 100 万个页面?而使用动态页面,只需要一个页面就可以了。

数据

动态页面,基础的来说,有两部分组成: (动态)数据的获取页面的呈现
我们可以泛称数据的来源数据库,但这个词一般特指专门的数据库软件,比如 MySQL、Mongodb。
为了让数据的获取更快,也有依赖于内存的,比如 Redis。有不少场景,不是纯数据库驱动,比如常用的(内存)缓存软件 memcache,也还有直接以本地的文件夹内的数据为数据源的(这个相对少见)。

网站最大的性能问题,常常是出现在数据查询、获取上的。如果性能的瓶颈不在数据库,并且场景不是太特殊(比如对 CPU 要求特高),那就是网站的后端写得太糟糕了。
决定数据库的瓶颈,主要在于硬盘,硬盘分为机械硬盘、SSD 硬盘。一般来说,跑数据库的,我们要用 SSD 硬盘。但是,就我们多数人、多数产品而言,即使机械硬盘,绝多数时候也是无法碰触到其物理上的性能瓶颈。

数据库索引

并非因为使用了 MySQL、Mongodb 这类的数据库,就意味着数据在查询的时候是高速的。决定查询高速与否,是 索引
大多数的数据库索引基本算法是 B树 (B Tree) 或者类似的衍生算法。而关于这个算法,我知道是怎么回事,但也仅是皮毛,更加深入的机理,就不清楚了,或者说,也不想进一步弄清楚了。

所谓的 算法,对我们大多数人而言,拿来用就是。算法也并非很高深的概念,基础到取一串数字中的最大值或者大小排序,都是算法。
B树 就是典型拿来用就好了的算法,似乎真实的场景中,不会遇到需要我们手写 B树 的情况。
还有些算法,有其实用价值存在,某些场景下,我们需要可以重写这样的算法,比如 二分法,这个算法我们在《全端》系列中的后续课程中应该会介绍到。

说回 B树。你可以通过搜索引擎了解更多,或者就按照下面的内容,做简单的理解。一定要理解,即使不能理解 B 树,也要理解在它基础上索引的逻辑

假设有三本书,如下所示:

INDEX: category  --  when_to_buy -- book_name
哲学类 -- 2019 年买的 --《查拉图拉斯如是说》
哲学类 -- 2019 年买的 -- 《王阳明》
经管 -- 2019 年买的 -- 《Rework》

我们自己在整理书的时候,三本书分别做了归档。也就是做了一个索引 category + when_to_buy,索引并不是万能的,索引是根据指定次序,那么:

  1. 如果我们查询具体的书名 book_name,是查询不到的,因为它无法命中索引。
  2. 如果查询某个 category,这个可以。
  3. 如果查询 2019 年买的这个when_to_buy,也是查询不到的数据,因为它虽然在索引中,但它没有匹配到索引的头部次序。
  4. 如果查询 cateogry+when_to_buy,当然可以。
  5. 如果查询 when_to_by+category 呢?也可以,跟 cateogry+when_to_buy 是一样的。
  6. 假设三个字段构成了索引, a+b+c,那么查询 a+b 或者 b+a 都一样,可以的,然而 a+c 或者 b+c 则是不可以的,因为匹配不到这个索引。

B 树索引,简而言之,就是按照预定的索引次序,数据库中的每条数据都会在索引中对应了一个位置。查询要 匹配索引,匹配了,就意味着可以在索引中快速找到位置,返回数据。
多个字段组成的索引,一般叫 复合索引,复合索引遵循索引固定的次序,都是前向匹配

  1. 比如 a+b+c 这个索引,支持查 aa+ba+b+c 这三种情况。
  2. 前向匹配查询时,某个字段亦是前向匹配的。比如我们对 book_name 做单一字段的索引,那么前向匹配查询,以 为关键字,也能找到数据 (查拉图拉斯如是说),并且,它是命中索引的。

好了,停下来,想一想?
B 树能实现数据的快速查询,但是它很死板。也因为很死板,所以才很高效。
为什么特别强调要理解 B 树?与其强调 B 树,倒不如说强调知道如何构建数据库的索引。索引没有构建恰当的数据库,是性能的黑洞。
其实,数据库 的使用入门,我们也讲完了……

FirstWeb

如果我们在 HTML+CSS 的入门课程中,介绍过多后端相关的内容,容易本末倒置。
而客观实际呢,凡是面向用户的网站,基本上是动态页面,而只要涉及到动态页面,又与服务器上的后端语言相关。总而言之,为了让 HTML+CSS 拥有更实际的功用,在学习的过程中,就必须学习不是 HTML+CSS 的技术,有些悖论的感觉。
为了解决这个悖论,我将早年的产品 FarBox、Bitcron 简化,完成了一个小型的后端框架 farbox-lite,可以直接将本地的一个文件夹转为一个动态的网站。这个小型框架集成到了 FirstWeb 中,所以,我们可以在不了解具体后端是什么工作机制的时候,却可以完成后端程序,当然使用的主要语言仍然是前端的 HTML+CSS (Jade、SCSS)。
具体 FirstWeb 这个 App 中,farbox-lite 这个动态页面的 Web 框架要如何使用,在后面的章节中,会对其工作机制进行说明。