状态管理

无计划的状态管理

redux 本身是一个状态管理器，可以对数据状态进行一系列的操作，例如

1
2
3
4
5
6
7
8

// count 状态
let state = { count: 1 };
//打印状态
console.log(state.count);
//修改状态
state.count = 2;

以上即为最简单的状态保存和修改，但是这里有一个问题，即不能在 count 更改后通知使用 count 的地方，这里我们可以用订阅/发布者模式实现一下:

CSS3 Grid

css布局： Table -> Float + Position –> Flex

CSS Grid(网格) 布局（又称为 “Grid(网格)” ），是一个二维的基于网格的布局系统. 它的目标是完全改变我们基于网格的用户界面的布局方式。

CSS Grid布局是目前CSS 中最强大的布局系统。与 flexbox 的一维布局系统不同，CSS Grid 布局是一个二维布局系统，也就意味着它可以同时处理列和行。

通过将 CSS 规则应用于 父元素 (成为 Grid Container 网格容器) 及 子元素（成为 Grid Items 网格项），你就可以轻松使用 Grid(网格) 布局。

布局的传统解决方案，基于盒状模型，依赖 display属性 + position属性 + float属性。它对于那些特殊布局非常不方便，比如，垂直居中就不容易实现。

W3C提出的一种新的方案

Flex布局，可以简便、完整、响应式地实现各种页面布局。

要编写高性能的网站和应用，除了确保编写的代码能高效地运行外，还需要了解浏览器是如何进行渲染工作的。

浏览器主要组成结构