摘要：
基本三角形构建矩形 们知道，一个矩形其实可以由两个共线的三角形组成，即 V0, V1, V2, V3，其中 V0 → V1 → V2 代表三角形A，V0 → V2 → V3代表三角形B。 默认情况下，WebGL 会认为顶点顺序为逆时针时代表正面，反之则是背面，区分正面、背面的目的在于，如果开启了背面 阅读全文
摘要：
三角形图元的分类 WebGL 的基本图元包含点、线段、三角形，而三角形又分为三类 基本三角形 三角带 三角扇 #####基本三角形（TRIANGLES） 三角带（TRIANGLE_STRIP） 三角扇（TRIANGLE_FAN） 绘制三角形的步骤 但是图形是有多个点组成，那么就应该考虑如何绘制多个点 阅读全文
摘要：
WebGL 应用包含两个要素：JavaScript程序和着色器程序。本节我们通过绘制一个点来演示这个过程，麻雀虽小，但五脏俱全。使用 WebGL 绘制一个点虽然简单，但是它仍需要 JavaScript 程序和着色器程序共同完成。 我们的目标是绘制一个在屏幕中心，大小为 10，颜色是红色的点。 1、准 阅读全文
摘要：
专业术语介绍 图元：WebGL 能够绘制的基本图形元素，包含三种：点、线段、三角形。 WebGL绘图API： 它只能会点、线、三角形？一定是我看错了。你没看错，就算是这样一个复杂的模型，也是一个个三角形画出来的。 片元：可以理解为像素，像素着色阶段是在片元着色器中。通过图元装配生成的多边形，计算像素 阅读全文
摘要：
WebGL 产生的背景和历史 在学习 WebGL 之前，我们先简单了解一下 WebGL 产生的背景。WebGL 规范产生以前，浏览器如果想实现 3D 动画效果，只能借助一些浏览器插件，比如 Adobe 的 Flash、微软的 SilverLight 等来实现，那么，为了打破这一局限，各大知名公司联手 阅读全文
摘要：
上一节我们已经实现了diff和比较两个vnode之后手动更新视图，这一节我们除了要给数据进行proxy劫持之外，还要给数据添加watcher，监听数据改变时更新视图。下面是响应式原理的图解： ;(function () { function defineReactive (obj, key, val 阅读全文
摘要：
在上一节中我们已经将代码整理了一下，这一节我们要做的是比较新旧dom，然后通过diff算法判断虚拟dom时候有变化，是否需要刷新视图。为了让代码更加清晰，我们这边还是做了简化，假设父节点下只有一个元素。并且手动调用更新方法，暂时不做数据双向绑定更新视图。 理解patch函数 不管是第一次挂载到视图还 阅读全文
摘要：
前面我们已经实现了虚拟dom转变为真实dom，并且挂载到页面的逻辑了，其实已经很接近vue源码的思想了，但是我们还是稍微调整一下代码，让我们调用的时候更加像vue。现在我们要声明一个vue函数，做以下几件事： 声明一个Vue函数，让我们可以new调用这个函数 获取传入的options参数 初始化数据 阅读全文
摘要：
其实看了很多的vue源码，很多的东西只是脑子会了，能说就是写不出来。vue的源码有很多的边界判断的代码，纯粹的核心原理代码其实并不多，刚好看到一个比较好的vue2源码精简版，自己手动跟着敲一敲，作为记录，希望自己对源码的理解更深一点。Talk is cheap，Show me the code，让我 阅读全文
摘要：
什么是职责链模式 职责链模式的定义是：使多个对象都有机会处理请求，从而避免请求的发送者和接收者之间的耦合关系，将这些对象连成一条链，并沿着这条链传递该请求，直到有一个对象处理它为止。职责链模式的名字非常形象，一系列可能会处理请求的对象被连接成一条链，请求在这些对象之间依次传递，直到遇到一个可以处理它 阅读全文