前端每周学习分享--第8期

1.canvas

用于绘制图形，制作照片，创建动画，甚至可以进行实时视频处理或渲染。

我读的教程是MDN的Canvas教程，有细节有示例，非常棒了，推荐大家阅读。

这篇学习 HTML5 Canvas 这一篇文章就够了也很推荐。

这篇canvas参考手册提供了getContext("2d") 对象的属性和方法

我参照教程，也撸了几个canvas的代码放在codepen上。

波点圆代码

轨迹弹球代码

加强轨迹粒子代码

2.H5游戏

three.js

three.js是一个javascript的3d库，我们可以用它来做各种3D效果和3D游戏，相当受欢迎。默认Ammo.js为默认物理引擎，基于JavaScript语言的3D库，耗性能，加载慢，效果一般。

Three.js官网上有超多示例网站、游戏，大多相当酷炫，看看就很心动了，自行去官网上感受一下👍

Createjs

免费开源的H5游戏、动画和交互应用框架，比较轻量级，不适合大型游戏，不支持3D渲染。

Cocos2d-js

老牌2D 优秀开发引擎，支持接入微信小游戏，需要使用工具开发，不方便接入其他业务系统。

Egret

大型游戏制作能手，能够使用图形化工具制作游戏，性能优越。支持接入微信小游戏，支持2D、3D，使用 typescript 开发业务逻辑，代码规范。

3.webpack配置本地代理服务以实现跨域

这个第5周的分享里配置vue.config.js里也讲过了，不过这周是实打实的用过了，才真正体会到它的好处。

'/article/api': {
        target: 'http://xxx.yyy.com',
        changeOrigin: true,
        pathRewrite: function (path, req) { return path.replace('/article/api', '') }
      },