基于webComponents的纯原生前端框架

news2024/11/17 13:28:09

我本人的个人开发web前端前框架xui,正在开发中,业已完成50%的核心开发工作,并且在开发过程中逐渐完善.

目前框架未采用任何和市面上框架模式,没有打包过程,实现真实的开箱即用。

当然在开发过程中也会发现没有打包工具加持,我们在很多工作时候,是很麻烦的。所以后期我打算退出基于webpack打包工具版本的框架,实现对低浏览器版本的支持和提升开发速度。但是具体方案目前尚未明确。请大家关注!

组件化开发

基于html5 web component的组件化方案,实现页面组件化拆分和组合。

路由加载

采用History模式路由, 并且由路由自动化完成页面加载。

事件监听

框架完成了事件触发和事件监听的封装,在页面和组件事件处理上更加方便。

数据驱动

采用原生Proxy方法实现响应式数据,并且在数据响应后驱动页面更新。

UI更新

采用artComponent模板引擎,在数据更新后实现UI更新,当然这里做了优化处理,尽量减小页面渲染受影响的范围,实现最小化更新。

UI组件库

基于框架,开发了一套常用UI组件,提升开发速度。组件库采用开放原则,也就是说别人都可以使用我的开发接口去开发组件库。

敬请大家关注。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/2176474.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

二阶低通滤波器Simulink仿真测试

1、如何将S域传递函数转为Z域传递函数 传递函数如何转化为差分方程_非差分方程转成差分方程-CSDN博客文章浏览阅读4.1k次,点赞4次,收藏50次。本文介绍了如何将传递函数转化为差分方程,主要适用于PLC和嵌入式系统。通过MATLAB的系统辨识工具箱获取传递函数,并探讨了离散化方…

通义灵码【最佳编程实践】说明

通义灵码是JetBrains或VSCode集成开发环境(IDE)中嵌入的一款智能开发助手工具,旨在通过人工智能技术简化软件开发过程,提升开发效率。本文将介绍在开发过程中如何深度体验多种辅助功能。其主要功能包括:通用大模型问答…

AdaptIoT——制造业中使用因果关系的自我标签系统

0.概述 论文地址:https://arxiv.org/abs/2404.05976 在许多制造应用中,机器学习(ML)已被证明可以提高生产率。针对制造业应用提出了一些软件和工业物联网(IIoT)系统,以接收这些 ML 应用。最近&…

2-仙灵之谜(安装钱包及添加网络)

2-仙灵之谜(安装钱包及添加网络) 前言(该游戏仅供娱乐)正文 前言(该游戏仅供娱乐) 新部署的相关链接如下 游戏访问地址:   http://8.130.162.58/ RPC网络:   网络名称 &#xf…

目前最好用的爬虫软件是那个?

作为一名数据工程师,三天两头要采集数据,用过十几种爬虫软件,也用过Python爬虫库,还是建议新手使用现成的软件比较方便。 这里推荐3款不错的自动化爬虫工具,八爪鱼、亮数据、Web Scraper 1. 八爪鱼爬虫 八爪鱼爬虫是一…

尚硅谷vue3+TypeScript笔记大全

源码及视频:通过百度网盘分享的文件:尚硅谷vue3 链接:https://pan.baidu.com/s/19zVM5Xsr1UP7tZ4D0mhVqA?pwdgmta 提取码:gmta 1. Vue3简介 2020年9月18日,Vue.js发布版3.0版本,代号:One Piec…

演示:基于WPF的DrawingVisual开发的频谱图和律动图

一、目的:基于WPF的DrawingVisual开发的频谱图和律动图 二、效果演示 波形图 极坐标 律动图极坐标图 律动图柱状图 Dock布局组合效果 三、环境 VS2022,Net7,Win10,NVIDIA RTX A2000 四、主要功能 支持设置起始频率,终止频率,中心…

我把「国产Sora」接入了「小爱」,邀你免费体验

前段时间,搞了个微信 AI 小助理-小爱(AI),爸妈玩的不亦乐乎。 零风险!零费用!我把AI接入微信群,爸妈玩嗨了,附教程(下) 不仅可以智能问答,文生图的能力也接了进来&…

HTML+CSS 水滴登录页

文章目录 一、效果演示二、Code1.HTML2.CSS 三、实现思路拆分 一、效果演示 实现了一个水滴登录页的效果。页面包含一个水滴形状的登录框和两个按钮,登录框包括用户名、密码和登录按钮,按钮分别为忘记密码和注册。整个页面的设计非常有创意,采…

每日一练 2024.9.29(1)

目录 解题思路与代码实现 一、问题分析 二、解题策略 伪代码: 三、代码实现 四、代码解析 五、解题过程总结 六、运行过程示例 示例 1: 示例 2: 七、对比分析 八、改进建议 九、总结 解题思路与代码实现 这道题目要求我们模拟买…

如何解决调试dev-出++5.11不成功问题

🏆本文收录于《全栈Bug调优(实战版)》专栏,主要记录项目实战过程中所遇到的Bug或因后果及提供真实有效的解决方案,希望能够助你一臂之力,帮你早日登顶实现财富自由🚀;同时,欢迎大家关注&&am…

【CKA】二、节点管理-设置节点不可用

2、节点管理-设置节点不可用 1. 考题内容: 2. 答题思路: 先设置节点不可用,然后驱逐节点上的pod 这道题就两条命令,直接背熟就行。 也可以查看帮助 kubectl cordon -h kubectl drain -h 参数详情: –delete-empty…

一个家越来越有钱,是因为女人身上有这3个好习惯!

在一个家庭中,女人往往扮演着举足轻重的角色。 她们不仅是家庭的支柱,也是家庭和谐与繁荣的重要因素。 正所谓“家和万事兴”,一个家庭是否能够兴旺发达,与家中女人的习惯和态度息息相关。 实际上,一个家越来越有钱…

ubuntu20.04安装CUDA与cudnn

这里写目录标题 一、NVIDIA显卡驱动安装二、安装CUDA官网找对应版本下载安装文件安装配置环境变量 三、安装cuDNN选择版本另一种下载方式 四、cuDNN与CUDA关系CUDAcuDNN的依赖关系与CPU的交互开发编程角度图示 总结 一、NVIDIA显卡驱动安装 我这里之前就装好了 使用命令 nvid…

DCDC电源设计工具(软件)(二)—— DC/DC Designer(MPS)

目录 一、简介 二、主页介绍 1、芯片选择 (1)在数据库中选择芯片 (2)通过下拉列表/具体型号选择芯片 2、编辑参数 (1)输入主要规格 (2)输入可选规格 (3&…

基于Arduino的自弹尤克里里机器人

需要项目源码资料的可以私信我 基于Arduino的自弹尤克里里机器人 一、简介二、材料清单三、工具四、实现过程步骤1:实物图步骤2:3D打印部件步骤3:组装上半部分步骤4:组装下半部分步骤5:安装导轨步骤6:设置…

人工打电话的操作步骤指南

如果有一套外呼系统,那么在功能上有哪些具体如何操作 在进行人工电话沟通时 一套清晰、高效的操作流程对于实现沟通目标至关重要 以下是详细的人工打电话操作步骤 涵盖从准备到后续跟进的全过程 如果有一套外呼系统,那么在功能上有哪些具体如何操作 …

CST仿真分析:圆柱形谐振腔的模式分析

波导谐振器一般可以由波导两端短路形成,矩形和圆柱形谐振腔比较常见。矩形谐振腔模式的表示,是从波导的TEmn和TMmn变成了TEmnp和TMmnp,p是沿z方向的周期。之所以我们这里分析圆柱形,一是三个下角标更不容易理解(TEnip和…

组合优化与凸优化 学习笔记5 对偶拉格朗日函数

有的时候约束条件有点难搞,我们可以把它放到目标函数里面。 记得之前凸函数的时候的结论吗?一大堆函数,每一段都取最大的,最后会得到一个凸函数。同理,每一段都取最小的,得到的是一个凹函数。就这样&#x…

【如何学习操作系统】——学会学习的艺术

🐟作者简介:一名大三在校生,喜欢编程🪴 🐡🐙个人主页🥇:Aic山鱼 🐠WeChat:z7010cyy 🦈系列专栏:🏞️ 前端-JS基础专栏✨前…