汉吉斯特Hanjst+更新升级:error reporting, innerLoop和loadingLayer

过去的几个月里,汉吉斯特Hanjst进行了一些升级,有功能增强,也有性能优化,为Hanjst的生产环境部署增砖添瓦、保驾护航。为便于后续维护和持续更新改进,兹备忘于下。

* 12:48 Saturday, April 27, 2019, + readable error reporting for template erros
* 19:19 Sunday, May 19, 2019, + renderTemplateRecurse for deep-in include files.
* 18:44 Friday, May 31, 2019, + allow limited support for variables in xxxelse scope, bugfix for includeScript.
* 07:58 6/2/2019, + imprvs with _appendScript to appendScript for async call.
* 16:31 Wednesday, June 5, 2019, + imprvs with parentNode=BODY
* 19:18 Monday, June 10, 2019, + bugfix for asyncScripts.
* 22:29 Thursday, June 13, 2019, + loadingLayer. “<div id=”Hanjstloading” style=”width: 100%; height: 100%; z-index: 99;”> Xxxx Loading… 加载中… </div>” .
* 21:36 Thursday, June 20, 2019, + warning for MSIE browsers.

  1. 增加可读性错误异常报告
    当Hanjst遇到语法错误时,抛出可读性的异常代码描述,形成可以追踪的错误报告,其大致形式如下:

    Hanjst template code exec failed.

    {“stack”:”ReferenceError: $myAds2 is not defined\n at eval (eval at renderTemplate (http://example.com/view/default/js/Hanjst.js?v=201906171103:468:15), :405:1)\n at renderTemplate (http://example.com//view/default/js/Hanjst.js?v=201906171103:468:39)\n at _callRender (http://example.com//view/default/js/Hanjst.js?v=201906171103:679:9)\n at http://example.com//view/default/js/Hanjst.js?v=201906171103:698:9\n at http://example.com//view/default/js/Hanjst.js?v=201906171103:701:3″,”message”:”$myAds2 is not defined”}

    Line 404:

    Line 405: if( $myAds2[‘sadplace’]==’homepage_up_right’){

    Line 406: tpl2js.push(” <a href=\””);

    根据这些具体到行号的错误提示信息,开发者可以较快地找到出错位置并进行修正。如上所示,表明在模板引擎进行解析时,发现在第405行有未定义的 $myAds2 这样的变量未经初始化就开始使用,所以报错。

    注意!值得注意! Hanjst 全程开启 JavaScript 的 Strict mode,不允许使用未经定义的变量!

  2. 改进Hanjst循环嵌套模板的处理方法
    在初版的 Hanjst模板引擎设计中,我们假定模板的嵌套只有一层,也即一个模板中通过include 指令引入了另外一个模板内容。
    {include file=”$anotherTemplateFileContent”}

    随着 Hanjst 应用场景的复杂化,多层嵌套成为必然,有鉴于此,我们升级改进了 Hanjst,允许无限层的模板内容嵌套。也就是父页面可以引入嵌套子页面,子页面内也可以进一步的嵌套引入孙页面,如此递归不止。

  3. 增加对 forelse, foreachelse, whileelse下的模板语言支持
    通常情况下,如果循环一个数列,如果遇到轮空的情况,默认我们设计了给一个提示,如下所示。

    {foreach $myList as $l}
        //- some data
    {foreachelse}
        //- a warning…
    {/foreach}

    这次改进是在 “a warning” 部分给与有限功能的模板支持,比如允许使用变量进行替换操作等。

  4. 改进对async引入脚本的处理方法
    对嵌套页面的脚本程序引入有两种方式,一种是直接执行,另外一种方式是记账并延后进行引入。
    其中后面一种异步的async方式,对提升页面加载速度有很大帮助。所以在 Hanjst的改进中予以实现,当有非必要可以延后加载的脚本,都可以通过 async方式安排当页面首屏加载完成后再继续。
    上面是理想情况,还有非理想的情况时,当有些页面元素还为就绪时,一些依赖于其上的脚本就无法执行,这时候就是迫不得已需要等页面元素就绪后再加载脚本程序。
    根据这些,我们建议对象什么类脚本程序可以直接加载,而对对象的调用类脚本,一般都安排async异步加载为好。

    <!–
    JavaScript codes which will be run only once after Hanjst’s work,
    should be placed below here, after Hanjst, and keep in mind:
    1) ‘use strict’ mode, add comma for each sentence;
    2) src of Objects should be loaded in sync mode, e.g. jquery.min.js;
    3) invokes with Objects should be loaded in async mode, e.g. base.js;
    –>

  5. 增加对Hanjst父元素的探测
    这是改进是由于 HTM本身限制导致的,根据实验结果所示,浏览器的解析引擎进行页面渲染时,如果是放入未关闭的 div 内的脚本,默认是不执行而直接跳过的。
    如此以来,如果将 Hanjst 放入一个 div 元素,则默认随页面自动启动的 Hanjst解析引擎启动后,随后的加载嵌套页面的脚本等就无法实现了。
    有鉴于此,当 Hanjst启动时,探测如果其父元素不是默认和预期的 body 时,就抛出异常进行报错。
    待开发者进一步解决问题之后再继续。

  6. 增加loadingLayer
    当Hanjst进行编译页面时,原始代码会曝露给调用者,尽管时间是 毫秒级(ms)的,但如果碰上较慢的网速,依然有不完美的“印象”。
    为此,我们设计了当 Hanjst 工作时,前端预置一个”幕布”, loadingLayer , 显示给用户,当页面完成编译后,大幕揭开,完美呈现!

    <div id=”Hanjstloading” style=”width:100%;height:100%;z-index:99;opacity:0.92;position:absolute;background-color:#ffffff;”> Hanjst Loading… 加载中

    Hanjst loading layer默认的元素id是 Hanjstloading, 也可以通过启动参数:

    Hanjst.LoadingLayerId = ‘myLoadingLayer’;

    来指定自定义的元素Id。

  7. 增加对过时MSIE的探测
    如果浏览器太老了,比如 微软 IE浏览器,特别是8.0以前的版本,对JavaScript支持有限,无法顺利完成 Hanjst 的编译与解析,就会出错。
    为便于用户感知这些,我们改进 Hanjst 增加了对 MSIE太老版本的探测,并给用于相应的提示。



Hanjst是一种基于JavaScript的模板语言及解析引擎,她运行在客户端/服务器端。

Hanjst能够表述逻辑控制,能够实现与服务器端模块语言相同的功能。

  • Hanjst当完全在客户端解析时,节省服务器端计算资源;

  • Hanjst模板语言独立,不与服务器端资源做任何绑定;

  • 纯粹的MVC,层间数据用JSON格式传递;

  • 常见模板语言功能全支持,附带复杂而强大的JavaScript编程能力;

  • 无学习成本,直接使用JavaScript书写模板语言;

  • ….

Hanjst 在线文档 & API .

此条目发表在-Hanjst/-汉吉斯特, 编程技术, 计算机技术分类目录,贴了, , , 标签。将固定链接加入收藏夹。

汉吉斯特Hanjst+更新升级:error reporting, innerLoop和loadingLayer》有5条回应

  1. Pingback引用通告: 🙋Hanjst汉吉斯特改进+enSafeExpression安全表达式等 | -UFQI-Blog

  2. Pingback引用通告: 🙋Hanjst汉吉斯特升级:+showImageAsync及性能改进等 | -wordpress-wadelau

  3. Pingback引用通告: 🙋Hanjst汉吉斯特升级:+showImageAsync及性能改进等 | -UFQI-Blog

  4. Pingback引用通告: ☘ gMIS吉密斯优化升级:+工作区,可读性异常信息,异步删除等 | -wordpress-wadelau

  5. Pingback引用通告: ☘ gMIS吉密斯优化升级:+工作区,可读性异常信息,异步删除等 | -UFQI-Blog

发表评论

您的电子邮箱地址不会被公开。 必填项已用*标注

Captcha Code