读书

  • 认识 HTTP 2.0

    HTTP 2.0 来了,从1.1到2.0,递增了一个大版本号,那么 HTTP 2.0 会给我们带来怎么样的技术革新呢?今天我们一起学习了解一下 HTTP 2.0 。


    ## HTTP 2.0 是什么?

    即超文本传输协议2.0版本,虽然协议的名字已经不是那么符合实际了(HTTP 1.0 开始即可传输二进制流等非文本内容)。

    我们来看看它的宣言草稿:

    HTTP 2.0 应该满足如下条件:

    • 相对于使用 TCP 的 HTTP 1.1,用户在大多数情况下的感知延迟要有实质上、可度量的改进;
    • 解决 HTTP 中的“队首阻塞”问题;
    • 并行操作无需与服务器建立多个连接,从而改进

  • 理解 JS 中的函数表达式与函数声明

    常用闭包的同学肯定很清楚下面一段代码:

    //通常的闭包写法
    (function () {
     ...
    }())

    那么我们的问题来了,为什么要在 function () {...}() 之外用圆括号包裹呢?解答这个问题,就需要我们理解 Javascript 中函数表达式与函数声明的概念。


    函数定义带来的错误

    虽然 function () {...} 看上去像是一个函数声明,但是由于没有函数名,它的本质其实是一个函数表达式。我们看下规范中对于函数声明与函数表达式的定义:

    56610c757e07a6abb9788b5ead774e0e_r

    可以看出来,函数声明是必须带有函数名的。所以在直接执行 function () {...


  • 学习 SVG(二)—— 变换

    这篇我们来学习一下 SVG 中的变换效果,有点类似 CSS 的 transform,但是 SVG 的变换是属性。


    效果列表

    变换 描述
    translate(x, y) 按照指定的 x 和 y 值移动用户坐标系统。如果没有指定 y 值,默认 0。
    scale(factor1, factor2) 使用指定的 factor1 和 factor2 乘以所有的用户坐标系统。比例值可以是小数或者负数。
    scale(factor) 和 scale(factor, factor) 相同。
    rotate(angle) 旋转用户坐标,中心点为 (0, 0)

  • 学习 z-index

    z-index 是作为一个平常的 CSS 属性,我们在实践中经常会用到。它表示了元素在 Z 轴上的层叠关系,数值越大,就越上层。那么你知道在未设置 z-index 的时候,元素的层叠关系是如何的吗?带着这个疑问,我们一起来探寻关于 z-index 你所不知道的知识。


    ## z-index 的最大值

    早年前不少面试官都会问候选人:你知道 z-index 的最大值吗?

    当我被问及这个问题时,第一个反应就是:懵逼了!因为我在实践中从来没考虑过 z-index 还有最大值的情况,总觉得是值越大,就越高层。

    这个问题其实换种说法就是在问,你知道带符号的 Int 类型(z-inde


  • 学习 SVG(三)—— 路径

    我们已经在本系列的第一篇文章中介绍了 SVG 中的一些基本形状,现在我们一起来学习一下路径元素 path 的一些知识。


    path 元素中的命令

    命令 参数 效果
    M m x y 移动到给定坐标
    L l x y 绘制一条直线。可以使用多组坐标来绘制折线
    H h x 绘制一条水平线
    V v y 绘制一条垂直线
    A a rx ry x-axis-rotation large-arc sweep x y 绘制一个从当前点到 (x, y) 的椭圆弧。椭圆上的 x 半径为 rx,y 半径为 ry。椭圆旋转 ry x-axis-rotation