Google推出了Native Client，让开发者将一些C/C++代码打包集成到浏览器中，然而，只有Chrome支持这项技术，达不到广义上的可移植要求。
几年前，Mozilla发布了asm.js，打开了性能优化的大门。他们最早提出了使用JS中的严格子集。通过限制语言的功能性，他们能够预测虚拟机的下一步反应，从而通过移除某些不必要的检查操作以提高性能。但这种技术也会影响语言的动态行为。
所有的这些技术构成了今天WA诞生的基础。WebAssembly运行在JS虚拟机内部，使用了JS的部分功能，这意味着它不仅能够与运行最新Web浏览器的设备兼容，也能做到向前兼容。为了实现这一点，设计人员正在开发一个polyfill，核心思想是将每个函数转换为语义上等效的JS代码，虽然这样做会影响运行性能，但至少能解决代码的运行问题。

【1】 高级排序算法

1.希尔排序

这个算法在插入排序的基础上做了很大的改善。希尔排序的核心理念与插入排序不同，它会首先比较距离较远的元素，而非相邻的元素。，用这个算法遍历数据集时，所有元素之间的距离会不断减小。工作原理：定义一个间隔序列来表示在排序过程中进行比较的元素之间有多远的间隔。有一些公开定义的间隔序列。（算法用到的间隔序列提前定义好）；

function shellsort() {
    var dataStore = this;
    var gaps = [5, 3, 1];
    for (var g = 0; g < gaps.length; ++g) {
        for (var i = gaps[g]; i < dataStore.length; ++i) {
            var temp = dataStore[i];
            for (var j = i; j >= gaps[g] && dataStore[j-gaps[g]] > temp;
                j -= gaps[g]) {
                dataStore[j] = dataStore[j - gaps[g]];
            }
            dataStore[j] = temp;
        }
    }
    return this;
}
Array.prototype.shellsort = shellsort;

1.class样式问题：

<span class="c_v_i_state" :class="[video == '1'?'bgcolor1aaf60':video == '2'?'bgcolor2dabff':video == '3'?'bgcolorff8b2d':'']">{{video == '1'?'正在直播':video == '2'?'即将开始':video == '3'?'直播回放':''}}</span>

除了三元运算符，也可以用普通的方法实现：

<span class="c_v_i_state" :class="{'bgcolor1aaf60':video == '1'}" v-if='video == 1'>正在直播</span>
<span class="c_v_i_state" :class="{'bgcolor2dabff':video == '2'}" v-if='video == 2'>即将开始</span>
<span class="c_v_i_state" :class="{'bgcolorff8b2d':video == '3'}" v-if='video == 3'>直播回放</span>

【1】 基本排序算法

1.冒泡排序 (比较容易实现，但是是最慢的排序算法之一)

数据像气泡一样从数组的一端漂浮到另一端。算法会多次在数组中移动，比较相邻的数据，当左侧值大于右侧值时将它们互换。
里层循环是两个相互比较，把最大的值放到最右边。外层循环表示把最大值放到最右边的循环的次数，直到最后剩下两个比较；

【1】 第一组迭代器方法不产生任何新数组，要么对于数组中的每个元素执行某种操作，要么返回一个值；

1.forEach() 接受一个函数作为参数，对数组中的每个元素使用该函数

1
2
3
4
5
6
7
8
9

function square(num) {
  print(num, num * num);
}

var nums = [];
for (var i = 0; i < 10; ++i) {
   nums[i] = i+1;
}
nums.forEach(square);

牛人总结vue组件库

1.vue-stomp(地址自行search吧) 实现mqtt消息推送通知

2.vue-video-player video播放器(基于videojs-关于flash-html5跟版本有关系)
参考

3.cropper.js 裁剪图片并上传(引入组件css样式有问题)
中文翻译

基础代码部分搭建：请访问另一篇博客 dialog弹层组件全面解析-实现思路一

添加编辑数据(一个组件)，删除数据弹层
里边包括多个弹层，不过大都雷同，这篇文章里补充弹层 user_import 子组件相关内容

具体介绍导入和进度条相关内容：
1.正式大型项目为了统一接口，单独把接口封装一个service

项目参考地址 video-contral-rewrite
效果如下：

我经常使用的工具是Sublime，偶尔会用到atom。

Media Source Extensions API

1. 前言

媒体源扩展 API（MSE） 提供了实现无插件且基于 Web 的流媒体的功能。使用 MSE，媒体串流能够通过 JavaScript 创建，并且能通过使用 <audio> 和 <video> 元素进行播放。

5.实现原理

Blob() 构造函数var aBlob = new Blob( array, options );

XMLHttpRequest.responseType 这是XHR返回响应的类型

谁知道可以返回那些类型？

XMLHttpRequest.responseType 属性是一个枚举值，返回响应的类型。
它还允许作者将响应类型更改为一个”arraybuffer”, “blob”, “document”, “json”, 或 “text” 。如果将一个空字符串设置为responseType的值，则将其假定为类型“text”。

4.ArrayBuffer

Blob() 构造函数var aBlob = new Blob( array, options );

• array 是一个由ArrayBuffer, ArrayBufferView(TypedArray类型化数组的构造函数), Blob, DOMString 等对象构成的 Array，或者其他类似对象的混合体，它将会被放进Blob。DOMStrings会被编码为UTF-8。
• ArrayBuffer 对象用来表示通用的、固定长度的原始二进制数据缓冲区。ArrayBuffer 不能直接操作，而是要通过类型数组对象或 DataView 对象来操作，它们会将缓冲区中的数据表示为特定的格式，并通过这些格式来读写缓冲区的内容。

ArrayBuffer 对象用来表示通用的、固定长度的原始二进制数据缓冲区。ArrayBuffer 不能直接操作，而是要通过类型数组对象或 DataView 对象来操作，它们会将缓冲区中的数据表示为特定的格式，并通过这些格式来读写缓冲区的内容。

3.MediaSource

• MediaSource是Media Source Extensions API 表示媒体资源HTMLMediaElement对象的接口。MediaSource 对象可以附着在HTMLMediaElement在客户端进行播放。
  Media Source Extensions API
  是Media Source Extensions API 表示媒体资源HTMLMediaElement（HTML媒体元素接口在属性和方法中添加了 HTML元素来支持基础的媒体相关的能力，就像audio和video一样。HTML 视频元素和 HTML 音频元素元素都继承自此接口）对象的接口。MediaSource对象可以附着在HTMLMediaElement在客户端进行播放。

详细资料请查看另一篇文章 Media Source Extensions
下边内容是有这篇文章中提取到的部分内容。

2. blob

1

<video src="blob:http://www.bilibili.com/d0823f0f-2b2a-4fd6-a93a-e4c82173c107"></video>

• a.什么是blob？

Blob 对象表示一个不可变、原始数据的类文件对象。Blob 表示的不一定是JavaScript原生格式的数据。 文件(即File)接口基于Blob，继承了 blob 的功能并将其扩展使其支持用户系统上的文件。

要从其他非blob对象和数据构造一个Blob，请使用 Blob() 构造函数。要创建包含另一个blob数据的子集blob，请使用 slice()方法。要获取用户文件系统上的文件对应的Blob对象，

1. 前言

现在看到任何我感兴趣的网页都会习惯性的打开调试工具，看看其代码写的怎么样。 有一天，看到了这句 HTML。

1

<video src="blob:http://www.bilibili.com/d0823f0f-2b2a-4fd6-a93a-e4c82173c107"></video>