網(wǎng)上有很多關于pos機程序說明, Cube 小程序技術詳解的知識，也有很多人為大家解答關于pos機程序說明的問題，今天pos機之家(m.afbey.com)為大家整理了關于這方面的知識，讓我們一起來看下吧!

本文目錄一覽：

1、pos機程序說明

pos機程序說明

Cube 渲染小程序

模塊組成

小程序視角，Cube 渲染引擎主要由以下模塊組成：

Components：主要是小程序規(guī)范里的組件；Layout：支持 Inline，Block，F(xiàn)lex，Inline-Block，Inline-Flex 等多種布局方式，還包括文本分詞，斷行等計算；Style：支持樣式解析，樣式匹配，樣式繼承，偽類和偽元素等多種選擇器；Rendering：管理渲染相關 Render Tree，圖片資源請求調(diào)度等；Animation：JS 和 CSS 動畫實現(xiàn)；JS Bridge：和 JS 引擎橋接；JS Engine：目前支持 V8，JSC，QuickJS；其中 Android 下支持 V8，QuickJS；Compositor：用于動畫和圖層的合成器（開發(fā)中）。

線程模型

Cube 小程序技術棧內(nèi)部有這么幾個線程：Bridge，Layout，Render，Paint，UI 等。

Bridge 線程：執(zhí)行 JS；與 AppX 橋接的類 DOM 的 JSAPI；處理 JS 相關事件；Layout 線程：布局計算；樣式計算與匹配；維護 Layout Tree；Render 線程：維護 Render Tree；綁定數(shù)據(jù)；分層；Paint 線程：生成繪制命令；UI 線程：平臺事件分發(fā)；UI 布局。

小結(jié)：

并行布局，異步繪制：這里的并行是指 JS 執(zhí)行，Layout 布局 以及 Render 三者完全并行處理。由于 Layout 和 Render，Paint 等不在一個線程，因此是異步繪制；多個線程協(xié)同工作，有點像 CPU 的 5 級流水線。

值得注意得是：Web 渲染引擎有個特點就是和 Node 相關的 DOM 操作必須和 JS 在一個線程。這就導致解析 HTML，布局，樣式計算，DOM，JS （包括垃圾回收）都在一個線程里。帶來的后果就是只有解析完文檔才能看到 UI 效果，這也是 Web 渲染小程序白屏時間較長的一個原因。

Cube 小程序技術棧，將“DOM操作” 和 JS 執(zhí)行解耦。因此 JS 的 GC 不會影響 UI 呈現(xiàn)。這種實現(xiàn)對于加快小程序啟動非常有幫助。由于布局計算和 JS 執(zhí)行也解開耦合，因此一般不會由于 JS 執(zhí)行阻塞 UI 交互。

Cube 小程序技術棧的特點

體積小，啟動快：主 so 只有 2.8 MB（如果包括 Ariver，AppX，InsideSDK，整體小程序技術棧最小是 5.7MB）。另外可以享受到 OS 的紅利（包括 UI 的初始化和緩存）；高性能：接近于原生體驗；內(nèi)存占用?。盒〕绦蚣夹g棧初始化后（包括 Inside SDK，Cube，AppX），大約只需要 7.5 MB；支持 Android，iOS 雙端。

與 Web 引擎對比

下面僅僅針對小程序場景與 Web 引擎對比：

技術演進

讓小程序業(yè)務低成本適配 Cube 渲染小程序，需要做三方面的工作：

擁抱 Web 技術，補齊前端開發(fā)常用的能力：包括 CSS，小程序組件等；完善相關工具：包括開發(fā)，調(diào)試，Profile，發(fā)布，打包等；針對 Cube 的架構(gòu)特點，深入優(yōu)化，并拉開和 Web 渲染的差異。提供更好的用戶體驗。

新的流式布局（Flow Layout）

最初 Cube 小程序使用只支持 Flex 布局 Yoga 用于布局計算。后面升級成支持 Block，F(xiàn)lex，Inline-Block等多種布局方式的 Flow Layout。從而解決開發(fā)者只能使用 Flex 布局的困擾。目前兩個布局引擎 Cube 內(nèi)部都支持。其中 Flow Layout 主要用在小程序，Yoga 用在卡片。兩者能力差異如下：

支持 CSS 樣式表

老版本的 Cube 只支持內(nèi)聯(lián)樣式和簡單的 CSS 選擇器；然而小程序并沒有約束 CSS，因此 Cube 擴充支持 CSS 樣式表，樣式繼承，多種選擇器等。從而使得 Web 渲染切換到 Cube 渲染，適配成本大大降低。甚至部分小程序可以做到在小程序 IDE 里基于 Web 渲染開發(fā)，然后打包成 Cube 渲染產(chǎn)物在真機上預覽。前端同學無需進行過多的修改和適配。

新老 Cube 版本，選擇器支持上的差異如下：

支持自動分詞，斷行（Inline Text）

最初 Cube 用的是 Android 和 iOS 提供的文本計算和繪制能力。這種技術方案（以下稱為平臺層 Text）存在3個問題：

性能問題：特別是 Android 下，利用 Android 平臺層的接口實現(xiàn)文本布局計算，導致在文本較多的情況下，布局耗時在渲染整體耗時里占比較高；富文本特性：富文本以及許多文本特性支持較麻煩；各平臺上實現(xiàn)文本效果存在細節(jié)差異或者兼容性問題。

針對上述問題，在 Flow Layout 基礎上增強支持 Inline Text 布局計算文本?；?Inline Text 可以較輕松實現(xiàn)以下富文本，圖文混排，分詞，自動換行等。

1.富文本

2.自動換行和分詞

Inline Text 實現(xiàn)前后的文本樣式對比如下：

采用 QuickJS 替代 V8

V8 雖然是性能最高的 JS 引擎，但是存在內(nèi)存占用大，初始化較慢等不足。在 IoT 或者低端設備上這些不足會被放大。因此在這些設備上，Cube 采用 QuickJS 取代 V8。一方面降低內(nèi)存占用，另外一方面提升初始化性能。

Cube 內(nèi)部目前適配了多個 JS 引擎，具體如下：

在 Android 移動端上使用 V8 和 JSIiOS 上使用 JSCIoT 等低端設備上使用 QuickJS

另外我們在開源 QuickJS 基礎上做了些優(yōu)化工作。優(yōu)化的結(jié)果大致如下（后續(xù)文章將詳細介紹）：

支持動畫和多媒體組件

除了上述基礎組件和能力之外，動畫和多媒體也是部分小程序不可缺少的。因此我們擴展支持了 Video，Canvas、Lottie，Live Player 等組件支持。并應用于 TV 大屏小程序、小游戲以及直播場景上。

在低端設備上，如何提高動畫幀率并且降低內(nèi)存占用也做了深度的優(yōu)化。以下是 Video 和 Canvas 組件在小程序中的效果圖：

Cavas 組件

Video 組件

Cavas 組件

Video 組件

支持多種模式的小程序產(chǎn)物

目前 Cube 支持多種模式的小程序產(chǎn)物：Native，Cube，Shared。

Native 模式：對應的是舊的 Cube 渲染小程序模式，不支持 CSS 樣式表，只能支持內(nèi)聯(lián)樣式和有限的幾種 CSS 選擇器。性能最高，兼容性較低；Cube 模式：在 Native 模式進化而來，支持 CSS 樣式表和多種 CSS 選擇器。性能良好，支持常用的 CSS 樣式和特性（包括樣式繼承，多種 CSS 選擇器）；Shared 模式：為了降低 Web 渲染的小程序遷移或者過渡到 Cube 渲染而開發(fā)。在同一個小程序產(chǎn)物里既支持 Web 渲染一部分頁面又支持 Cube 渲染一部分頁面。而且 Cube 渲染的頁面支持樣式表。這樣在性能和兼容性平衡。小程序產(chǎn)物相對于 Web 渲染的小程序，產(chǎn)物體積增加不會超過 10%。

注：如果需要 Web 產(chǎn)物兜底，則 Native 模式 和 Cube 模式的小程序產(chǎn)物，比 Shared 模式大。

研發(fā)進展

Cube 小程序在 TV 和 POS 機上和相關團隊，一起打磨小程序技術棧（包括渲染引擎，JS 引擎，AppX，Ariver 容器）等。

在 TV 上面臨的問題：

內(nèi)存少：有的設備只有 512MB 內(nèi)存，長列表滾動容易卡；需要支持焦點切換；CPU 主頻較低：有的只有 1GHz。

短中期目標是用小程序技術棧替代 WeeX 單頁。當前進展如下：

小程序啟動性能上超過 WeeX 單頁（低端設備上優(yōu)勢更明顯）；內(nèi)存占用上，小程序初始化后內(nèi)存占用小于 10MB，典型小程序整體內(nèi)存占用在 32MB 左右。

具體細節(jié)后續(xù)文章詳細總結(jié)。

在 POS 機上面臨的問題：

在 POS 機上跑點餐小程序，主要有面臨以下問題：

內(nèi)存少：部分設備只有 512MB 內(nèi)存，容易出現(xiàn)卡死和 OOM；CPU 核心少：部分 CPU 只有雙核（硬件性能大約是主流手機的 1/5）；長列表滾動卡。

短中期目標是用小程序技術棧替代 Flutter 開發(fā)的 App。當前進展如下：

小程序首屏啟動性能提升了 30%+；小程序重點的交互場景的頁面，比如：購物車，商品詳情頁等，都已接近 Flutter App；首頁滾動幀率達到 50，用戶已經(jīng)難以感知和 Flutter 的差異（Flutter 幀率是 60）；小程序內(nèi)存占用下降了 30%（本地測試已無卡死和 OOM）。

該場景主要是文本節(jié)點較多的長列表。采用了非常多的優(yōu)化方法，后續(xù)文章詳細總結(jié)介紹。

總結(jié)

為了適配小程序，Cube 渲染引擎在布局計算、樣式能力、組件支持，還有開發(fā)工具等在小伙伴一起努力下取得了較大的進展。同時在低端設備（比如：IoT 設備）或者性能敏感場景，Cube 小程序性能優(yōu)化，降低內(nèi)存占用也取得了不錯的效果。

而未來面對多種多樣的 IoT 設備，還需要加速技術演進以支持更多的場景。歡迎大家一起來交流討論。

以上就是關于pos機程序說明, Cube 小程序技術詳解的知識，后面我們會繼續(xù)為大家整理關于pos機程序說明的知識，希望能夠幫助到大家！