成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

[Laya游戲開發(fā)]小技巧使Laya構(gòu)建速度提高10倍

Harpsichord1207 / 1542人閱讀

摘要：為何選擇引擎微信小游戲推出之后，很多公司也相應(yīng)的進入到微信小游戲這個領(lǐng)域，現(xiàn)在市場上的游戲開發(fā)引擎，如都對小游戲有了很好的兼容性。

1. 為何選擇Laya引擎

微信小游戲推出之后，很多公司也相應(yīng)的進入到微信小游戲這個領(lǐng)域，現(xiàn)在市場上的游戲開發(fā)引擎，如Cocos、Egret、Laya都對小游戲有了很好的兼容性。目前公司技術(shù)棧主要是使用Cocos和Laya，經(jīng)過幾個項目的接觸，考量了引擎在IDE上的上手習(xí)慣，API的設(shè)計上，發(fā)現(xiàn)Laya更適合微信小游戲的開發(fā)。

2. 默認的Laya構(gòu)建方式

Laya在使用IDE默認創(chuàng)建項目后(本文選擇typescript語言),會在當前項目目錄下，新建一個為.laya的文件夾。默認生成的編譯配置文件為

其中compile.js為開發(fā)時默認運行文件，這里如果開發(fā)者是mac系統(tǒng)，使用F8編譯項目后，可能都會報以下錯誤：


通過報錯提示，這里如果出錯的話，將compile.js名稱改為gulpfile.js，并且，將文件內(nèi)gulp運行的默認task改為"default"。

通過compile.js文件可知，默認的Laya構(gòu)建方式是，使用gulp、browserify進行項目構(gòu)建，tsify編譯typscript，vinyl-source-stream用于將tsify構(gòu)建的node stream轉(zhuǎn)化為gulp能識別的stream文件。所以我們每次修改ts源碼，都需要手動點擊編譯或者使用F8編譯。并且，就Laya的3D示例項目，每次編譯的時間基本在1s~2s。

3. 改進的Laya構(gòu)建方式

對于web前端開發(fā)，可能都會配置webpack+webpack-hot-middleware之類進行代碼熱更新，開發(fā)web網(wǎng)頁的流程基本就是：修改代碼 -> 自動編譯 -> 自動刷新，倘若有兩個屏幕，開發(fā)者不需要去刷新瀏覽器、輸入命令重新編譯等機械重復(fù)的行為。既然Laya默認使用了browserify（其實browserify這幾年更新已經(jīng)很慢了），這里我們可以加入gulp.watch，觀察src目錄源文件，每當src下文件發(fā)生修改時，自動觸發(fā)編譯操作，相當于開發(fā)者不需要再按F8編譯。

gulp.task("watch", ["default"], () => {
    gulp.watch("../src/**/*.ts", () => {
        gulp.run("default");
    });
});

但是這種方式，相當于gulp重新進行編譯，實際編譯速度依然不快。那么問題來了，有沒有辦法編譯對時候，gulp只編譯修改的那部分，從而加快編譯速度？

4. 使用watchify監(jiān)聽文件變化并結(jié)合browserify-sync自動刷新網(wǎng)頁

通過gulp官網(wǎng)可了解到watchify到相關(guān)使用，這里我們將代碼改成，并結(jié)合browser-sync,帶來自動刷新網(wǎng)頁的功能。

const watchedBrowserify = watchify(browserify({
    basedir: workSpaceDir,
    debug: false,
    entries: ["src/Main.ts"],
    cache: {},
    packageCache: {}
}).plugin(tsify));

// 記錄watchify編譯ts的時候是否出錯，出錯則不刷新瀏覽器
let isBuildError = false; 
gulp.task("build", () => {
    return watchedBrowserify
        .bundle()
        .on("error", (...args) => {
           isBuildError = true;
            gutil.log(...args);
        })
        .pipe(source("bundle.js"))
        .pipe(gulp.dest(workSpaceDir + "/bin/js"));
    });

    gulp.task("watch", ["build"], () => {
        // 瀏覽器開發(fā)時自動刷新頁面
        browserSync.init({
            port: 3002, // 監(jiān)聽端口，這里注意是否和其他項目沖突
            server: {
                watchFiles: ["../bin/"], // 刷新網(wǎng)頁的監(jiān)控目錄
                baseDir: "../bin/"
            } 
    });
    //  watchify監(jiān)聽文件刷新
    watchedBrowserify.on("update", () => {
        isBuildError = false;
        runSequence("build", () => {
            if (!isBuildError) { // 沒有編譯錯誤時，刷新瀏覽器界面
                browserSync.reload();
            }
        });
    });
    // 打印watchify編譯日志
    watchedBrowserify.on("log", gutil.log);
});

其中，runSequence用于同步執(zhí)行g(shù)ulp任務(wù)，多次實踐，這里還需要加入變量isBuildError，在代碼編譯出錯時，不執(zhí)行browserSync的刷新。

最終效果：

編譯速度快了近10倍，瀏覽器也能自動刷新了，開發(fā)游戲又更加愉快了～

歡迎下載源代碼： https://github.com/derickweng...

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://systransis.cn/yun/105951.html

相關(guān)文章

  • 使用Laya引擎開發(fā)微信小游戲（上）

    摘要：本文由云社區(qū)發(fā)表使用一個簡單的游戲開發(fā)示例，由淺入深，介紹了如何用引擎開發(fā)微信小游戲。前段時間正好抽空研究了一下這塊的內(nèi)容，現(xiàn)做一個總結(jié)，針對如何使用引擎開發(fā)微信小游戲給大家做一下介紹。 本文由云+社區(qū)發(fā)表 使用一個簡單的游戲開發(fā)示例，由淺入深，介紹了如何用Laya引擎開發(fā)微信小游戲。 showImg(https://segmentfault.com/img/remote/146000...

    zhjx922 評論0 收藏0

  • 使用Laya引擎開發(fā)微信小游戲（下）

    摘要：點擊進入發(fā)布界面，在發(fā)布平臺選擇微信小游戲，此時生成可以在微信開發(fā)者工具下運行的版本使用微信開發(fā)者工具打開，已經(jīng)可以完美運行了。 本文由云+社區(qū)發(fā)表 6. 動畫 6.1 創(chuàng)建傘兵對象 在src目錄下創(chuàng)建一個新目錄role，用來存放游戲中角色。 在role里創(chuàng)建一個傘兵Soldier.ts對象文件。 module role{ export class Soldier extend...

    ivan_qhz 評論0 收藏0

  • 使用Google Closure Compiler進行Js代碼壓縮

    摘要：是什么是一個使下載和運行更快的工具。它解析您的，分析它，刪除死代碼并重寫并最小化剩下的內(nèi)容。它還檢查語法，變量引用和類型，并警告常見的陷阱。其他參數(shù)這里使用默認運行后就可以看到生成了壓縮的文件了。其他的代碼壓縮工具 1.Google Closure Compiler是什么？ The Closure Compiler is a tool for making JavaScript dow...

    young.li 評論0 收藏0

  • （Laya項目）JS/TS語言zip壓縮解壓縮三方庫及其使用

    摘要：語言的項目里，要用對壓縮過的文件解壓縮。壓縮二進制數(shù)據(jù)解壓二進制數(shù)據(jù)好了。中可以直接保存對象到文件，但不行，所以構(gòu)造成成通用的格式，壓縮后保存。保存的配置文件叫，以的形式加載，然后再把字符串轉(zhuǎn)成即可。 TS語言的Laya項目里，要用typescript對壓縮過的文件解壓縮。文件是AS3寫的工具導(dǎo)出的。怎么辦，上github找一個庫，地址如下https://github.com/imay...

    SQC 評論0 收藏0

  • TS項目中使用Protobuf的解決方案

    摘要：因為放棄對的維護而又一次火熱起來。流行的解決方案就是用。有中使用方式，實時解析方式解析方式靜態(tài)代碼方式事先導(dǎo)出的文件。早已有很多解決方案。好了，現(xiàn)在就可以在項目中使用的代碼了輸出 H5因為Adobe放棄對Flash Player的維護而又一次火熱起來。目前有l(wèi)aya和egret兩個H5游戲引擎，支持AS3、TS、JS三種語言開發(fā)。用H5開發(fā)游戲，繞不開與服務(wù)器的傳輸。流行的解決方案就是...

    hlcfan 評論0 收藏0

發(fā)表評論

0條評論

最新活動
閱讀需要支付1元查看
<