2019-7-9 What’s New

What’s New

一、浏览器、操作系统、搜索引擎相关

1.浏览器份额占比

2019年6月份，浏览器市场份额占比（来源：Netmarketshare ）：

• Chrome：66.29%
• Firefox：8.86%
• IE：7.70%
• Edge：6.36%

根据NetMarkerShare 最新数据，2019年上半年，MicrosoftEdge浏览器的市场份额呈直线上升的趋势，达到6.03%的历史新高。而Firefox和GoogleChrome都有所下滑。
这种趋势并非昙花一现。一方面，Windows10用户越来越多，MicrosoftEdge浏览器采用率也随之上升；另一方面，MicrosoftEdge浏览器目前已支持Windows7、Windows8等系统，这将带来一大批用户。
2020年微软将停止对Windows7的更新和维护，这意味着Windows10还有很大的上涨空间，届时MicrosoftEdge浏览器用户还会迎来大增长。

2.操作系统份额占比

近日，NetMarketShare 发布了全球操作系统市场份额的最新数据，显示 Windows 10 已占据主导地位。不过自 2019 五月更新发布以来，其份额几乎没有变动，仅从 45.73% 微增至 45.79% 。据悉，微软从5 月底开始推送 Windows 10 2019 五月更新（Version 1903），目前已全面开启 Windows Update 推送，意味着用户可通过手动检查来下载更新。

与此同时，Windows 7 的技术支持将于 2020 年 1 月截止，其份额也从 34.44% 下降到了 35.38% 。

这款从 2009 年征战至今的操作系统，将在 2020 年 1 月 14 日之后告别功能与安全更新，因此微软鉴于客户尽快升级到最新版本的 Windows 10 操作系统。

遗憾的是，从 Windows 10 到 Windows 7 的迁移过程仍然相当缓慢，目前仍有超过 3 / 10 的 PC 在运行 Windows 7 。
而自 2014 年 4 月以来被判死刑的 Windows XP，其份额也急速下滑到了 1.81% 。

出于兼容性问题的考虑、以及迁移到最新的 Windows 平台的软硬件成本，Windows XP 在全球各个组织和企业的环境中仍相当顽固。

3.搜索引擎份额占比

• Google 75.13%
• Bing 10.02%
• Baidu 9.66%
• Yahoo! 2.88%

可以看到微软的Bing搜索的份额不断增长，目前已超过百度。

二、Typescript介绍和迁移

首先推荐Typescript官方文档，入门一个新技术or新工具，直接啃官方文档都是最快最友好的方式。

1.介绍

这里我们使用接口来描述一个拥有firstName和lastName字段的对象

interface Person {
    firstName: string;
    lastName: string;
}

function greeter(person: Person) {
    return "Hello, " + person.firstName + " " + person.lastName;
}

let user = { firstName: "Jane", lastName: "User" };

document.body.innerHTML = greeter(user);

让我们使用类来改写这个例子。 TypeScript支持JavaScript的新特性，比如支持基于类的面向对象编程。

让我们创建一个Student类，它带有一个构造函数和一些公共字段。

还要注意的是，在构造函数的参数上使用public等同于创建了同名的成员变量。

class Student {
    fullName: string;
    constructor(public firstName, public middleInitial, public lastName) {
        this.fullName = firstName + " " + middleInitial + " " + lastName;
    }
}

interface Person {
    firstName: string;
    lastName: string;
}

function greeter(person : Person) {
    return "Hello, " + person.firstName + " " + person.lastName;
}

let user = new Student("Jane", "M.", "User");

document.body.innerHTML = greeter(user);

针对使用npm的用户：

 npm install -g typescript

在命令行上，运行TypeScript编译器：

tsc greeter.ts

会在当前目录下生成一个编译后的js文件

var Student = /** @class */ (function () {
    function Student(firstName, middleInitial, lastName) {
        this.firstName = firstName;
        this.middleInitial = middleInitial;
        this.lastName = lastName;
        this.fullName = firstName + " " + middleInitial + " " + lastName;
    }
    return Student;
}());
function greeter(person) {
    return "Hello, " + person.firstName + " " + person.lastName;
}
var user = new Student("Jane", "M.", "User");
document.body.innerHTML = greeter(user);

2.从javascirpt迁移

咱们组内web4.2框架和vue基础框架，都集成了webpack,故最方便的办法是在webpack进行配置

Webpack集成非常简单。 你可以使用 ts-loader，它是一个TypeScript的加载器，结合source-map-loader方便调试。 
npm install ts-loader source-map-loader

然后在webpack配置文件里面加上如下匹配即可

 module: {
        loaders: [
            { test: /\.tsx?$/, loader: "ts-loader" }
        ],

同时，需要在根目录加上tsconfig.json，来配置你的typescript

{
    "compilerOptions": {
        "outDir": "./built/",
        "sourceMap": true,
        "strict": true,
        "noImplicitReturns": true,
        "module": "es2015",
        "moduleResolution": "node",
        "target": "es5"
    },
    "include": [
        "./src/**/*"
    ]
}

三、关于迁移到Typescript的原因

1. 逐渐统治开源社区

大量重量级前端开源项目采用 TypeScript 开发，包括不限于：Angular、
VSCode、Vue3.0、RxJS、Mobx、Deno、Antd，而且这个趋势越来越明显，包括 Facebook 自家的 Jest 也宣布从 FlowType 转向 TypeScript。
可以说，TypeScript 的开源生态已经非常完善了，公司完全可以放心大胆得进行 TypeScript 化开发

2. TypeScript 是真正解决生产力问题的技术

请问前端开发中，引起错误的最多的三种报错是什么？

Uncaught TypeError: Cannot Read Property
TypeError: ‘undefined’ Is Not an Object (evaluating...)
TypeError: Null Is Not an Object (evaluating...)

居然是三种非常非常低级的错误，原因就是 JavaScript 是动态语言，只有运行时才会报错，这些低级错误在类型定义完整的 TypeScript 中不会发生，这就是 TypeScript 的优势之一，编码时就能规避大量的类型错误。

3.Vue3.0 会是 TypeScript 大规模普及的导火索

Vue3.0 将在下半年的发布，虽然尤雨溪确认 Vue3.0 支持 JavaScript 和 TypeScript 两种语言，但是 vue2.x 那种残疾级别的支持到现在原生支持 TypeScript，势必会引起大量以 vue 为技术栈的公司进行 TypeScript 化运动。
届时三大框架都可以完美支持 TypeScript，甚至其中有两个是由 TypeScript 直接开发的，而 vue 在国内的用户量最多，也最能影响 TypeScript 在国内的走势。

四、阿里新框架犸良

阿里作为中国互联网企业的标杆，不仅一直在为广大人民群众提供快捷便利的服务。阿里又推出了一款基于 Lottie 的动效设计平台 ── 犸良。能够快速生成设计师想要的动态效果，并交付给开发，极大地提高了设计效率和设计还原度犸良其实是一款基于人工的动效模板网站。所有的动态效果都是设计师提前做好的。基于 Lottie 的特性，将可编辑的属性进行模块化。
犸良支持全平台 iOS、Android、H5、小程序。无论是营销展位、活动页面、空状态还是产品icon。犸良编辑器对接投放平台，一站式完成动效创意制作和投放。

Lottie 的原理是将矢量图形和动态效果通过代码实现，复杂的图形导出图片资源。最终生成 json 文件+图片资源。犸良所做的就是，将 json 里的颜色属性提取出来，用户可以从外部修改。同样只需要替换图片资源，就可以让用户自己设计的图形根据 json 写好的运动方式来展示。如果你把一只移动的猪替换成猫了，那么你看到的效果就是一只移动的猫。

参考犸良官网