time1812的专栏

时间过得真快，Chrome 的版本已经升级到90了。这次的开发者工具更新中增加了flexbox调试工具，试了一下，挺有意思的。首先在Elemets 视图下，如果一个元素的display: flex的话，元素后面会显示一个 “flex” 的按钮，点一下网页上相应的位置就会出现一个虚线框表示出这个flexbox的位置。如图然后在边栏上styles标签下对应的flex定义处会出现一个按钮点开有惊喜…...

这里写自定义目录标题1. 简介1.1 PIXI 简介1.2 坦克大战游戏简介2. 实现细节2.1 技术选型2.2 环境搭建2.3 创建舞台2.4 游戏状态机2.5 消息总线2.6 加载页面2.7 开始页面2.8 我们的坦克1. 简介1.1 PIXI 简介PIXI JS是一款轻量级的HTML5的2D引擎，我看现在它的官网上并没有说自己是“游戏”引擎而是说“The HTML5 Creation ...

1. 前言过去两年我曾经在HTML5网页游戏声音播放上花费了大量时间来找坑，填坑。在这里我把过去的经验记录于此。2. IE112.1 不支持Web AudioIE 是我用过的唯一不支持 Web Audio 的浏览器。解决方案就是用HTML5 audio。什么？你的IE连HTML5 audio 也不支持？呃，那个解决的方案更简单，直接跟产品经理哭诉：不能支持IE6哇…2.2

Howler.js是一个不错的HTML5声音引擎。功能强大，性能不错，用起来也很方便。1. 官网https://howlerjs.com/ 其代码托管在GitHub上。2. 兼容性Howler默认使用Web Audio，但在IE上可以自动转为HTML 5 Audio。这点很是贴心。3. 声音激活移动端的Safari和Chrome都禁止网页自动播放声音，必须通过用户的操作，t

参考： https://developers.google.com/web/updates/2018/01/devtools Chrome更新很勤快，65又出了几天了。本地覆盖过去如果我们的服务器在本地（本机，localhost）的话，chrome可以支持在devtools里面映射到本地文件夹然后直接修改代码，就像是个IDE。但是如果是远程服务器就不行了。现在有了这个本地覆盖的功能，...

从本篇起，我将在此展示制作一些HTML5小游戏的过程和经验。本文描述的是一个经典又简单的小游戏，连连看。1. 计划1.1 目标快速建立一个连连看游戏原形。能玩就行。1.2 游戏特性介绍游戏展示一个m * n大小的表格表格每个格子里面有一个图标/符号每个图标都是成对出现玩家需要找到每对匹配的图标/符号如果玩家选中的两个图标/符号匹配并且其连线转折次数小...

前几年做网页游戏，近来改做基于React的单页应用。虽然这是完全不同的两种软件产品，但感觉React和游戏引擎本身的设计颇有相似之处：架构层级中的定位无论是游戏引擎，还是React，都是作为核心基础库被应用于软件中。而且，它们的用处都是用于帮助构建图形用户界面(GUI)的工具，即视图层的基础工具组件。更具体来讲就是用于渲染。组件化为方便开发者的工作，React和游戏引擎都会提供自定义组件的...