来源: 颠覆网站C/S模式 没有服务器的网站会带来什么变革?
原理:
1、itty bitty 使用可以显著减小 HTML 体积的 Lempel–Ziv–Markov 链算法对网页内容进行压缩(一些js脚本)。
2、压缩之后,itty bitty 对压缩后的内容进行 base64 编码,将其从二进制数据转换为可以安全存储在 URL 中的字母和数字字符串。转化的结果被称为 URL 片段(fragment),此时 itty bitty 会将该 URL 片段作为后缀附着在 https://itty.bitty.site/#Name/上,生成一个新的可传播的 URL,其中 Name 表示该页面的 title。生成的 URL 通过复制或者直接分享到 Twitter 等方式进行传播,接收者访问该 URL时,Web 浏览器会加载 itty.bitty.site 以逆转上述过程(js脚本),从而获取最初的 HTML 页面内容。
3、值得一提的是,因为没有服务器存在,那么用户访问该 URL 的时候,其网络请求并不会发往所谓的”服务器“(第一次下载js脚本还是要请求服务器的,后面网络请求的处理会从缓存中读取。一开始就把这些js脚本放在框架中,那就无需再请求服务器了),而是借助于 URL fragment 的特性“跳转到页面上的某个位置”。
简单网页生成步骤:
一、在https://codepen.io/pen?template=MXgrEr 上编写页面代码(html、css、js),保存会生成一个url,复制url。
二、访问https://itty.bitty.site/edit,title自填,内容填写"上一步复制的url";会自动生成一个链接,这个链接无需网络也可以访问
例子:
https://itty.bitty.site/#%E6%B5%8B%E8%AF%95/XQAAAAK3AAAAAAAAAAAeHMqHyTY4PyKmqfkwr6ooCXSIMxPQ7ojYR153HqZD3W+keVdvwyoyd+luwncAkswMI6iRrxMuWxObDNkJYt8oC6FpHo209EpNCIqTjQ9S+qhCA3TIf8w/v8RUzbN/EQbDJXEuVNdh7dnL0TqcC2q2VrEd09PjWvz9bNd+MR4E49/nznBGHwczN1//2YgJQA==