Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
程序yang
unidocs-zh
提交
646dc552
U
unidocs-zh
项目概览
程序yang
/
unidocs-zh
与 Fork 源项目一致
Fork自
DCloud / unidocs-zh
通知
1
Star
1
Fork
0
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
0
列表
看板
标记
里程碑
合并请求
0
DevOps
流水线
流水线任务
计划
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
U
unidocs-zh
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
0
Issue
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
DevOps
DevOps
流水线
流水线任务
计划
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
流水线任务
提交
Issue看板
未验证
提交
646dc552
编写于
8月 23, 2022
作者:
DCloud_Heavensoft
提交者:
Gitee
8月 23, 2022
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
update docs/tutorial/renderjs.md.
Signed-off-by:
heavensoft
<
wanganxp@163.com
>
上级
22f16d6a
变更
1
隐藏空白更改
内联
并排
Showing
1 changed file
with
10 addition
and
4 deletion
+10
-4
docs/tutorial/renderjs.md
docs/tutorial/renderjs.md
+10
-4
未找到文件。
docs/tutorial/renderjs.md
浏览文件 @
646dc552
## renderjs
`renderjs`
是一个运行在视图层的js。它比
[
WXS
](
/tutorial/miniprogram-subject.html#wxs
)
更加强大。它只支持app-vue和h5
。
`renderjs`
是一个运行在视图层的js。它比
[
WXS
](
miniprogram-subject.md#wxs
)
更加强大。它只支持app-vue和web
。
`renderjs`
的主要作用有2个:
-
大幅降低逻辑层和视图层的通讯损耗,提供高性能视图交互能力
-
在视图层操作dom,运行for web的
js库
1.
大幅降低逻辑层和视图层的通讯损耗,提供高性能视图交互能力
2.
在视图层操作dom,运行 for web 的
js库
**平台差异说明**
...
...
@@ -11,6 +11,10 @@
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|√(2.5.5+,仅支持vue)|√|x|x|x|x|x|
-
nvue的视图层是原生的,无法运行js。但提供了bindingx技术来解决通信阻塞。
[
详见
](
nvue-api.md#bindingx
)
-
微信小程序下替代方案是wxs,这是微信提供的一个裁剪版renderjs。
[
详见
](
miniprogram-subject.md#wxs
)
-
web下不存在逻辑层和视图层的通信阻塞,也可以直接操作dom,所以在web端使用renderjs主要是为了跨端复用代码。如果只开发web端,没有必要使用renderjs。
### 使用方式
设置 script 节点的 lang 为 renderjs
...
...
@@ -34,13 +38,14 @@
### 功能详解
-
大幅降低逻辑层和视图层的通讯损耗,提供高性能视图交互能力
逻辑层和视图层分离有很多好处,但也有一个副作用是在造成了两层之间通信阻塞。尤其是小程序和
App的Android端阻塞问题影响了高性能应用的制作。
uni-app的app端逻辑层和视图层是分离的,这种机制有很多好处,但也有一个副作用是在造成了两层之间通信阻塞。尤其是
App的Android端阻塞问题影响了高性能应用的制作。
`renderjs`
运行在视图层,可以直接操作视图层的元素,避免通信折损。
在hello uni-app的canvas示例中,App端使用了
`renderjs`
,由运行在视图层的
`renderjs`
直接操作视图层的canvas,实现了远超微信小程序的流畅canvas动画示例。具体在
[
hello uni-app
](
https://m3w.cn/uniapp
)
示例中体验,对比App端和小程序端的性能差异。
-
在视图层操作dom,运行for web的js库
官方不建议在uni-app里操作dom,但如果你不开发小程序,想使用一些操作了dom、window的库,其实可以使用
`renderjs`
来解决。
在app-vue环境下,视图层由webview渲染,而
`renderjs`
运行在视图层,自然可以操作dom和window。
...
...
@@ -56,6 +61,7 @@
*
不要直接引用大型类库,推荐通过动态创建 script 方式引用。
*
可以使用 vue 组件的生命周期不可以使用 App、Page 的生命周期
*
视图层和逻辑层通讯方式与
[
WXS
](
/tutorial/miniprogram-subject.html#wxs
)
一致,另外可以通过 this.$ownerInstance 获取当前组件的 ComponentDescriptor 实例。
*
注意逻辑层给数据时最好一次性给到渲染层,而不是不停从逻辑层向渲染层发消息,那样还是会产生逻辑层和视图层的多次通信,还是会卡
*
观测更新的数据在视图层可以直接访问到。
*
APP 端视图层的页面引用资源的路径相对于根目录计算,例如:./static/test.js。
*
APP 端可以使用 dom、bom API,不可直接访问逻辑层数据,不可以使用 uni 相关接口(如:uni.request)
...
...
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录