10分钟打通Blender→Cocos！3D游戏建模极简入门
本文主要是从Cocos开发者角度，讲解如何在Blender中创建一个基础的3D球体模型，并导入到Cocos引擎使用。 基于Cocos Creator 3.4.2（3.x任意版本均可）+ Blender 4.3.2（若使用旧版Blender，导出菜单路径可能不同） PS：Cocos Creator引擎… 阅读更多 »10分钟打通Blender→Cocos！3D游戏建模极简入门
游戏研发
游戏研发
轻量级绘图库NanoVG使用简介
开源项目地址：https://github.com/memononen/nanovg 一 NanoVG NanoVG是一个跨平台、基于OpenGL的矢量图形渲染库。它非常轻量级，用C语言实现，代码不到5000行，非常精简地实现了一套HTML5 Canvas API，做为一个实用而有趣的工具集，用来构… 阅读更多 »轻量级绘图库NanoVG使用简介
随笔：WebGL着色器
使用WebGL的方便之处在于，无需搭建开发环境，只要有一个支持WebGL的浏览器就可以了。 着色器 用WebGL绘图必须使用着色器。分为两种： 顶点着色器 顶点是指二维或三维空间中的一个点，例如二维或三维图形的端点或交点。顶点着色器就是用来描述顶点特性（如：位置、颜色）的程序。 示例如下： void… 阅读更多 »随笔：WebGL着色器
Egret引擎的RES.getResByUrl方法在微信小游戏平台的实现流程
一 如何适配微信小游戏平台 Egret引擎构建微信小游戏版本后，会在library目录下生成image.js文件，通过重写ImageProcessor类来适配微信小游戏平台，以代替默认的图片加载器。 示例代码如下。 const processor = new ImageProcessor(); RE… 阅读更多 »Egret引擎的RES.getResByUrl方法在微信小游戏平台的实现流程
Egret引擎启动流程和源码裁剪
最近因项目需要，对Egret引擎5.x版本的核心库做了一些裁剪，原因是游戏启动中有30-40%的时间都是在加载引擎代码，虽然Egret引擎自身已经很小巧，但为了缩短启动时间，还是删除了一部分用不上的引擎源码，力求更精简。 引擎源码对应的是安装目录下的src/egret文件，最终优化后的结果是，构建后… 阅读更多 »Egret引擎启动流程和源码裁剪
解决Egret引擎加载外部图片跨域问题
使用Egret引擎加载外部图片，有时会碰到跨域问题。除了要在服务器上配置资源允许跨域外，还需要Egret引擎允许跨域，否则texture无法在webgl上下文中渲染。 如下所示，在加载图片前增加一行代码就可以了。 egret.ImageLoader.crossOrigin = ‘anonymous’… 阅读更多 »解决Egret引擎加载外部图片跨域问题
微信小程序/小游戏运行环境小结
1 运行环境 微信小程序分为逻辑层和渲染层，分别运行在各自的线程中。两个线程之间的通信经由微信客户端（Native）做中转，逻辑层发送网络请求也经由Native转发。 渲染层使用WebView进行渲染，逻辑层采用JSCore运行JS脚本。因为一个小程序可能存在多个界面，所以渲染层也可能有多个WebV… 阅读更多 »微信小程序/小游戏运行环境小结
微信小游戏和小程序的区别
微信小游戏在小程序的基础上提供了WebGL接口的封装，使渲染能力和性能有大幅度提升。 和H5游戏相比 小游戏 = H5游戏 + (微信社交能力、文件系统、工具链) – (DOM、BOM、CSS、EVAL) 和小程序相比 小游戏 = 小程序 + (渲染、文件系统、多线程) – (多页面、WXSS、WX… 阅读更多 »微信小游戏和小程序的区别
3D游戏引擎笔记
1 数学知识 1.1 坐标系 分为左手坐标系和右手坐标系两种，主要区别在于z轴的指向，z轴指向屏幕内的是左手坐标系，z轴指向屏幕外的右手坐标系。Unity和Direct3D使用的是左手坐标系，OpenGL使用的右手坐标系。 法线和切线 与椭圆有且仅有一个交点的直线，叫做椭圆的切线。二者公共点，叫做切… 阅读更多 »3D游戏引擎笔记
JavaScript实现软件光栅化渲染器02-如何画直线
项目代码：https://github.com/foupwang/JavaScript3DRenderer 开发环境：VSCode+Chrome浏览器 参考：《Windows游戏编程大师技巧》(第2版) /《3D游戏编程大师技巧》（André LaMothe） 前文介绍了画点函数，本文说明如何绘制直… 阅读更多 »JavaScript实现软件光栅化渲染器02-如何画直线
Bresenham快速画直线算法(中文翻译+注释)
原文：https://www.cs.helsinki.fi/group/goa/mallinnus/lines/bresenh.html 基本Bresenham算法 考虑在光栅网格上绘制一条直线，这条直线的斜率是 $0\leq m \leq 1$。 斜率定义：假设直线起点是(x1, y1)，终点是(… 阅读更多 »Bresenham快速画直线算法(中文翻译+注释)
JavaScript实现软件光栅化渲染器01-如何画点
项目代码：https://github.com/foupwang/JavaScript3DRenderer 开发环境：VSCode+Chrome浏览器 参考：《Windows游戏编程大师技巧》(第2版) /《3D游戏编程大师技巧》（André LaMothe） 整个项目跟平台相关的，只需要一个类似D… 阅读更多 »JavaScript实现软件光栅化渲染器01-如何画点
JavaScript实现软件光栅化渲染器-前言
项目代码：https://github.com/foupwang/JavaScript3DRenderer 开发环境：VSCode+Chrome浏览器 参考：《Windows游戏编程大师技巧》(第2版) /《3D游戏编程大师技巧》（André LaMothe） 软件光栅化渲染器，是指用CPU（软件）… 阅读更多 »JavaScript实现软件光栅化渲染器-前言
WebGL编程01
WebGL是什么 WebGL是一项结合了HTML5和JavaScript，用来在网页上绘制和渲染复杂三维图形(3D图形)的技术。WebGL基于OpenGL ES 2.0，也使用GLSL ES编写着色器。 Canvas是什么 HTML5引入标签，定义了网页上的绘图区域，允许JavaScript动态地绘… 阅读更多 »WebGL编程01
H5游戏如何配置Nginx缓存但是index文件不缓存
expires max 表示最长过期时间，即一直缓存。 expires -1 表示立即过期，即不缓存。 按如下配置，使test整个目录可以被客户端浏览器缓存，但是index.html文件不缓存，使版本重新构建后，访问index文件能实时刷新，适用于生成了MD5的h5游戏。 Nginx配置实例如下 s… 阅读更多 »H5游戏如何配置Nginx缓存但是index文件不缓存
游戏开发中一些常用的数学知识
三角函数公式 正弦（sin） sinA = a / c。值区间在 -1.0 到 1.0 之间 余弦（cos） cosA = b / c。值区间在 -1.0 到 1.0 之间 正切（tan） tanA = a / b。 余切（cot） cotA = b / a。 弧度计算 Math.sin(x)和Ma… 阅读更多 »游戏开发中一些常用的数学知识
WebSocket和SocketIO使用总结
1、WebSocket是什么？ WebScoket是一种让客户端和服务器之间能进行双向实时通信的技术。它是HTML最新标准HTML5的一个协议规范，本质上是个基于TCP的协议，它通过HTTP/HTTPS协议发送一条特殊的请求进行握手后创建了一个TCP连接，此后浏览器/客户端和服务器之间便可以通过此连… 阅读更多 »WebSocket和SocketIO使用总结