UIKIT开发前必读

2024-9-9 15:16| 发布者: 9zo1wx| 查看: 4180| 评论: 0

摘要: 前端架构

一、前端框架

主流前端框架有HJCVUEReact

所有前端框架都源于HTMLJavaScript,只是每个框架的语法不同

轻应用支持所有的前端框架,只是打包、构建、引用、配置的方式有所差异

轻应用Github平台提供了各个框架的接入demo示例,可供开发者参考(只用于接入演示,不建议开发者直接在demo上进行功能开发)

框架

Demo地址

HTML+JS+CSS

https://github.com/Ezviz-OpenBiz/EZUIKit-JavaScript-npm/tree/master/demos/base-demo

React

https://github.com/Ezviz-OpenBiz/EZUIKit-JavaScript-npm/tree/master/demos/react-demo

VUE2

https://github.com/Ezviz-OpenBiz/EZUIKit-JavaScript-npm/tree/master/demos/vue-demo

VUE3

https://github.com/Ezviz-OpenBiz/EZUIKit-JavaScript-npm/tree/master/demos/vue3-demo

 

二、Webassembly

UIKIT 采用浏览器 WebAssembly 特性,通过浏览器端上解析视频流。

ezuikit-js底层使用无插件解码库(使用C++语言开发,调用计算机的CPUGPU进行码流的解封装和解码),浏览器本身无法运行C++代码,也无法直接调用计算机的硬件资源

webassembly是专门为浏览器设计的一种二进制指令格式,用于将C++代码编译成浏览器可以执行的语言,配合JavaScript,实现浏览器调用C++代码,操作计算机硬解资源

综上所述,要想使用ezuikit-js,浏览器就必须支持webassembly

部分版本过低的浏览器,或者非主流魔改的浏览器可能不支持webassembly,导致ezuikit-js无法使用(判断当前浏览器是否可用,可以访问:https://caniuse.com/?search=webassembly

 

三、资源加载

ezuikit-js内有一个ezuikit_static文件夹,用于存放解码库、样式文件、三方库等资源

为避免对用户项目的打包、加载时间产生过大的影响,将这些资源放在萤石静态资源服务上

用户初始化ezuikit-js时,会通过http请求,动态获取所有依赖资源

由于浏览器的安全限制,用户集成了ezuikit-js后,可能会出现跨域报错,用户可以将ezuikit_static文件夹放到项目本地,并在初始化时配置【staticPath: "/ezuikit_static"】避免远程加载导致的跨域问题

 

四、打包构建

常用的打包工具有webpackviterollup

由于ezuikit-js的打包构建为UMD格式,部分打包工具在打包时可能会报错

工具

使用教程

webpack

https://www.webpackjs.com/concepts/

vite

https://vitejs.cn/vite3-cn/guide/features.html

rollup

https://www.rollupjs.com/tutorial/

 

1

路过

雷人

握手

鲜花

鸡蛋

刚表态过的朋友 (1 人)

评论

您需要登录后才可以发表言论 登录立即注册
Powered by 【杭州赋睿科技有限公司】 萤石用户社区(浙ICP备2024101974号-2) 使用条款 | 隐私政策 | 经营许可
关灯 返回顶部
返回顶部