Hanjst🙋汉吉斯特:更新升级+asyncScripti等改进

Hanjst🙋汉吉斯特 上一次更新已经是半年多前的事了,这期间随着研发工作的推进和在新项目新场景中的更多部署,她也随着进行小步骤地改进和升级,兹一一记录如下,备查。
始于2022年2月24日的俄罗斯侵略乌克兰的战争,也差不多持续了四个月了。英勇的乌克兰公民仍在顽强而奋勇地抵抗,尽管在我们写这篇日志的一天中,他们又有差不多100多位战士牺牲在卫国战争的前线!向乌克兰的坚守、勇敢与正义致敬!

Hanjst🙋汉吉斯特 历经五年来的发展与迭代,已经逐渐成熟稳定,并在多个关键应用及场景中表现优良。近期的主要Bug修复和改进主要内容如下。

1. 改进对注释行的处理函数 _remedyMemoLine

如前文所述对JavaScript代码中的注释行和HTML中的注释行的处理是我们关注的重点之一( Hanjst汉吉斯特与龙书编译原理 , https://ufqi.com/blog/hanjst-imprv-202111-with-memoline/ ),也是容易导致Bug的地方,这次改进之一也是关于注释行的处理。
比如针对JavaScript代码中的注释行处理,其中的注释标志是 // 而在程序代码中,常量字符网址的写法中就有类似 http:// , 所以需要额外的代码来进行这样的异常处理。

true && (segStr.match(/[a-zA-Z0-9-]+?.[a-zA-Z0-9-]+?[:]*/gm)
&& (segStr.indexOf(‘ ‘) < 0 || segStr.indexOf(‘/’) > -1)
and true) …

2. 改进条件表达式的行内式处理

Hanjst🙋汉吉斯特 支持行内表达式(内联)方式书写模板表达式。一些特殊字符需要做转义,以区分 Hanjst 表达式和原生的 HTML表达式,如 HTML的语句起始字符< 和终结字符 > , 当使用行内表达式(内联)方式时,需要将大于号和小于号转义为 &gt; 和 &lt; .
这次改进是针对行内表达式的更复杂语句的支持。

3. 新增 asynchronous Scripts 处理的计数器 asyncScripti

Hanjst 支持模板之间的嵌套,同时也支持在被嵌套的子模版中进一步地引入JavaScript或者CSS等文件,这些文件的引入方式,其中CSS依靠浏览器本身,Hanjst处理相对简单。而JavaScript的在子模版的引入方式,处理相对复杂。子模版中引入JavaScript主要依靠 appendScript 来实现。其中又进一步地的区分,引入的JavaScript是同步还是异步,如果是异步引入JavaScript,可以优先尽快地完成当前页面的绘制。

异步地引入JavaScript主要依靠在调用 appendScript 时,使用 window.setTimeout 方法来推迟对 appendScript 的调用时机,延迟一个时间窗之后再执行相应的对待引入方法的执行。以此来实现异步地引入更多的JavaScript,而同时又能够相对快的加载当前模板页所需第一屏展示的内容。

子模版(内嵌模板)中被异步引入的JavaScript文件,理论上来说应该是没有先后顺序关系的,因此在同样是异步加载时,我们之前的做法就是给每一个这样的脚本程序分别分配一个等量范围内的随机数等候时间,比如默认的 100~200毫秒. 这种处理方式,在绝大多数情况下,都是行得通的,通常也以脚本在模板文件中的先后顺序,顺延相应的时间后,一一地被执行、被引入。

但在另外一个苛刻的情况下,比如需要严格限制或者要求被引入脚本需要明确而精准的先后顺序时,就可能由于脚本没有按预期顺序地进行加载而出错。实际的案例如第三方图表JavaScript类库 HighCharts 中的 HighStock ( https://www.highcharts.com/demo/stock ),当更进一步地引入 indicators.js rsi.js 或者 wma.js时,如果按目前的 Hanjst 写法,可能由于后三者的加载顺序问题导致页面程序报错。

Hanjst的改进措施是引入 asyncScripti 参数,将每一个异步加载的JavaScript脚本文件都赋予一个顺序号码,相应地,在执行window.setTimeout时,依据asyncScripti 的序号大小,给与不同长短时间的等候时间,以此来映射在原生模板文件中的被引入文件的顺序。
由此,依据asyncScripti的控制,可以确保前一行引入的JavvaScript文件一定会在后一个被引入的JavaScript之前被执行,被引入。

改进前:
‘parseInt(Math.random()*1000+500));’);

改进后:
‘parseInt(Math.random()*100+’+((asyncScripti++)*100)+’));’);

使用改进后的处理程序,使得每一个被引入的JavaScript以每个间隔100毫秒的步骤顺序加入到待处理队列,同时通过Math.random进一步增大0~100毫秒的延迟,从而每个被引入的JavaScript的实际间隔在 100~200毫秒之间。

改进后的 Hanjst 经过实测可以兼容此前版本的应用环境,也可以很好地解决HighCharts stock相关JavaScript类库的带有时序要求的程序文件的引入。
Hanjst 再一次地成功进化。


除了键盘侠打嘴炮,我们还可以真金白银地支持发生在乌克兰的自由与奴役相对决的反侵略战争。

捐助乌克兰网站: https://u24.gov.ua/

银行捐款账号信息:
(USD) US Dollar
BENEFICIARY
National Bank of Ukraine
BENEFICIARY BIC
NBUAUAUX
BENEFICIARY ADDRESS
9 Instytutska St, Kyiv, 01601, Ukraine
ACCOUNT NUMBER
804790258
BENEFICIARY BANK NAME
JP MORGAN CHASE BANK, New York
BENEFICIARY BANK BIC
CHASUS33
ABA 0210 0002 1
BENEFICIARY BANK ADDRESS
383 Madison Avenue, New York, NY 10017, USA
PURPOSE OF PAYMENT
for ac 47330992708


Hanjst
Hanjst 汉吉斯特 Logo

🙋Hanjst汉吉斯特 是一种基于JavaScript的模板语言及模版解析引擎,她运行在客户端或服务器端。

🙋Hanjst汉吉斯特 能够表述逻辑控制,能够实现与服务器端模版语言相同的强大功能。

  • Hanjst当完全在客户端解析时,节省服务器端计算资源;
  • Hanjst模板语言独立,不与服务器端资源做任何绑定;
  • 纯粹的MVC,层间数据用JSON格式传递;
  • 常见模板语言功能全支持,附带复杂而强大的JavaScript编程能力;
  • 无学习成本,直接使用JavaScript书写模板语言;
  • ….

Hanjst is a JavaScript-based templating language and parsing engine that runs on both the client-side and/or server-side.

Hanjst can express logical controls and achieve the same functionalities as the server-side templating languages.

  • Hanjst’s Run-time in client-side, reduce computing render in server-side;
  • Hanjst is Language-independent, not-bound with back-end scripts or languages;
  • Totally-isolated between MVC, data transfer with JSON;
  • Full-support template tags with built-in logic and customized JavaScript functions;
  • No more tags languages to be learned, just JavaScript;
  • ….

全文首发: https://ufqi.com/blog/hanjst-asyncscripti/ , -R/P2SV

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

发表评论

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

Captcha Code