Cocos Creator 源码解读：引擎启动与主循环

最新推荐文章于 2026-08-07 16:38:06 发布

原创

最新推荐文章于 2026-08-07 16:38:06 发布 · 2.2k 阅读

本文深入解析Cocos Creator游戏引擎的启动流程，从index.html和main.js开始，逐步剖析cc.game.run、cc.game.prepare及cc.director.mainLoop等关键步骤。文章详述了主循环中组件调度器、缓动系统、动画管理和物理系统的运作，并对setTimeout和setInterval进行了对比。通过本文，读者能更深入理解Cocos Creator引擎的工作原理。

前言

本文基于 Cocos Creator 2.4.3 撰写。

Ready?

不知道你有没有想过，假如把游戏世界比作一辆汽车，那么这辆“汽车”是如何启动，又是如何持续运转的呢？

如题，本文的内容主要为 Cocos Creator 引擎的启动流程和主循环。

而在主循环的内容中还会涉及到：组件的生命周期和计时器、缓动系统、动画系统和物理系统等…

本文会在宏观上为大家解读主循环与各个模块之间的关系，对于各个模块也会简单介绍，但不会深入到模块的具体实现。

毕竟如果要把每个模块都“摸”一遍，那这篇文章怕是写不完了。

Let’s Go!

希望大家看完这篇文章之后能够更加了解 Cocos Creator 引擎。

同时也希望本文可以起到「领进门」的作用，大家一起加油呀~

另外《源码解读》系列（应该）会持续更新，如果你想要皮皮来解读解读引擎的某个模块，也欢迎留言告诉我，我…我考虑下哈哈哈~

正文

启动流程

index.html

对于 Web 平台来说 index.html 文件就是程序的起点。

在默认的 index.html 文件中，定义了游戏启动页面的布局，加载了 main.js 文件，并且还有一段立即执行的代码。

📝 这里截取 main.js 文件中一部分比较关键的代码：

// 加载引擎脚本
loadScript(debug ? 'cocos2d-js.js' : 'cocos2d-js-min.ec334.js', function () {
   
   
  // 是否开启了物理系统？
  if (CC_PHYSICS_BUILTIN || CC_PHYSICS_CANNON) {
   
   
    // 加载物理系统脚本并启动引擎
    loadScript(debug ? 'physics.js' : 'physics-min.js', window.boot);
  } else {
   
   
    // 启动引擎
    window.boot();
  }
});

上面这段代码主要用于加载引擎脚本和物理系统脚本，脚本加载完成之后就会调用 main.js 中定义的 window.boot 函数。

📱 原生平台

对于原生平台，会在 {项目目录}build\jsb-link\frameworks\runtime-src\Classes\AppDelegate.cpp 文件的 applicationDidFinishLaunching 函数中加载 main.js 文件。

——来自渡鸦大佬的补充

📦 代码压缩

脚本文件名中带有 -min 字样（如 index.min.js）一般代表着这个文件内的代码是被压缩过的。

压缩代码可以节省代码文件所占用的空间，加快文件加载速度，减少流量消耗，但同时也让代码失去了可阅读性，不利于调试。

所以开启调试模式后会直接使用未经过压缩的代码文件，便于开发调试和定位错误。

main.js

boot

对于不同平台 main.js 的内容也有些许差异，这里我们忽略差异部分，只关注其中关键的共同行为。

关于 main.js 文件的内容基本上就是定义了 window.boot 函数。

💡 对于非 Web 平台，会在定义完之后直接就调用 window.boot 函数，所以 main.js 就是他们的起点。

而 window.boot 函数内部有以下关键行为：

定义 onStart 函数：主要用于加载启动场景
cc.assetManager.init(...)：初始化 AssetManager
cc.assetManager.loadScript(...)：加载 src 目录下的插件脚本
cc.assetManager.loadBundle(...)：加载项目中的 bundle
cc.game.run(...)：启动引擎

这部分的代码就不贴了，小伙伴们可以看看自己的项目构建后的 main.js 文件。

cc.game

cc.game 对象是 cc.Game 类的一个实例，cc.game 包含了游戏主体信息并负责驱动游戏。

说人话，cc.game 对象就是管理引擎生命周期的模块，启动、暂停和重启等操作都需要用到它。

[源码] CCGame.js: https://github.com/cocos-creator/engine/blob/2.4.3/cocos2d/core/CCGame.js

run

cc.game.run 函数内指定了引擎配置和 onStart 回调并触发 cc.game.prepare() 函数。

📝 源码节选：

函数：cc.game.run

run: function (config, onStart) {
   
   
  // 指定引擎配置
  this._initConfig(config);
  this.onStart = onStart;
  this.prepare(game.onStart && game.onStart.bind(game));
}

[源码] CCGame.js#L491: https://github.com/cocos-creator/engine/blob/2.4.3/cocos2d/core/CCGame.js#L491

prepare

cc.game.prepare 函数内主要在项目预览时快速编译项目代码并调用 _prepareFinished 函数。

📝 源码节选：

函数：cc.game.prepare

prepare(cb) {
   
   
  // 已经准备过则跳过
  if (this._prepared) {
   
   
    if (cb) cb();
    return;
  }
  // 加载预览项目代码
  this._loadPreviewScript(() => {
   
   
    this._prepareFinished(cb