NodeRed节点编辑用于边缘计算和规则引擎,能做带UI界面和业务逻辑的上位机或前端应用吗?

先说结论,可以,但是需要有页面嵌套继承类似的技术,实现页面模块化封装,否则难以实现复杂应用。


相信目光敏锐的人都在关注节点编辑在自身行业的应用!

NodeRed在边缘计算做数据协议解析、以及物联网平台中作为规则链引擎,是一个非常典型的例子:

在3D引擎中也用于代替脚本代码,制作比如游戏、动画等动作逻辑:

再比如最新的AI人工智能大模型使用中,比如comfyui,用节点编辑连线方式,代替脚本代码编程,实现用户业务逻辑编排,调用大模型的能力调整参数,精准输出用户想要的结果:

其他比如电话机器人话术工作流也用到简单的节点编辑:

总的来说,节点编辑技术,可以通过拖拽、连线方式,无代码搭建用户业务逻辑,实现特定的功能流程。

对于可视化拖拽编辑,到了4202年了,大家都不会陌生。在节点编辑流行起来之前,可视化拖拽编辑通常用于数据可视化的UI界面展示用途。

这里就有意思了,既然有WEB组态这类能可视化拖拽编辑搭建UI界面,又有节点编辑这样搭建业务逻辑,是否能够两者融合,功能兼具呢?

或者说如题,节点编辑做边缘计算的同时,希望有UI表单组件节点,也能参与节点编辑,这样连线逻辑,用来实现前端UI图形界面交互,也用来参与业务流程逻辑比如数据解析、接口调用等功能。

如果能实现,那么常规WEB组态除了能无代码拖拽搭建界面,还能实现业务逻辑;NodeRed这类节点编辑器,除了能做规则流程逻辑,也能够无代码搭建带有交互业务逻辑的前端界面了。

这样前端的逻辑功能和UI展示都能够无代码解决,岂不美哉!

想法很美好,现实很骨感!节点编辑如果只是功能节点,比如发邮件、串口,这些功能独立性比较强,逻辑性要求并不会太多。但是UI表单组件就不一样了!

一个简单的输入框组件,就有背景颜色、边框颜色、文字内容、输入时事件、回车事件等等属性(如果暂且把事件也归类为回调函数类型的属性)。

当输入框操作对话框时,试图将文本内容在输入结束后回车,能够将内容给到对话框,并且触发弹窗。

这样一个简单的逻辑,就需要对输入框和对话框两个节点进行连线编辑,一方面连线需要将输入框文字属性内容提取出来,传递给对话框;另一方面,需要连线确保输入框文字输入结束时,触发对话框弹窗。

UI界面的节点编辑,连线逻辑的灵活性要远高于纯粹的功能型节点,或者说包含了功能型的节点。

此外,还需要重点考虑的是可封装性!

不论是web组态还是节点编辑器,都没有封装性而言,简单说,一个页面或者画布,做的界面或者逻辑,跟其他页面是完全独立的。功能类似的,需要复制过去修改,类似PPT一样。即便存在类似模板的概念,本质上也只是减少手动复制的动作,没法达到像组件那样封装、可复用的效果。

在WEB编辑器中,就直接页面复制即可。但是节点编辑器中,一个页面逻辑很多,连线会变得异常复杂!可读性和可维护性随着需求的增大而减少,最后还不如写代码来的清晰!

 要知道代码开发,尤其是面向对象的开发,最大的好处就是模块化封装!将复杂的功能模块或者可重用的部分,单独打包,使用时只需要关心输入和输出即可。

NodeRed如果要实现复杂业务逻辑+UI界面和交互逻辑,必然要求考虑到如何将部分UI组件或者功能模板的连线,封装到一个独立的画布或页面中,再引入到当前页面上使用,且完全不受影响,跟直接在当前页上效果一样。

要实现这点,NodeRed在构建复杂业务逻辑,或者搭建带有UI界面和业务逻辑的上位机或前端应用,才有一定的可能性,否则反而是开倒车,最终华而不实!

关于实现这一点,有一篇文章提到的页面嵌套继承技术,可能是一个很好的突破点:

《回顾发展史,WEB组态终于可以搭建业务系统了!》

文中提到UIOTOS(www.uiotos.net)实现的页面嵌套继承技术,能够将当前页面中某一块区域的UI或功能节点组件以及连线,整体一键封装到内嵌页面中。

这个过程中,会自动创建一个新的页面,将选中的区域粘贴过去,并且在选中区域用一个容器组件填充,并且将新建页面路径填入,实现嵌套!

嵌套后,内嵌页面中组件的属性,都能选择性继承到上层容器中,再次参与节点连线编辑,实现上层逻辑和内嵌的下层逻辑之间连通!

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

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

相关文章

实现 Android 设备屏幕录制的批处理脚本

在本文中,我们将介绍如何使用批处理脚本来实现在 Android 设备上进行屏幕录制,并将录制的视频文件传输到计算机上。这个脚本利用了 Windows 的批处理脚本和 Android 的 adb 工具。 背景 在进行 Android 应用开发、教学演示或问题排查时,我们…

推荐几本C#/.NET进阶书籍

前言 今天大姚给大家推荐7本C#/.NET进阶书籍,希望能帮助到有需要的小伙伴,当然假如你有更好的C#/.NET进阶书籍推荐欢迎文末留言。 C#/.NET/.NET Core推荐学习书籍(已分类):C#/.NET/.NET Core推荐学习书籍(…

golang rabbitmq客户端连接及重连

目录 1、连接、发送、发送异常、重连2、调用示例 1、连接、发送、发送异常、重连 package rabbitmqimport ("encoding/json""fmt""time""github.com/sirupsen/logrus""github.com/streadway/amqp" )type RabbitMQ struct {…

Spark在大数据集群下的部署

Spark部署文档 前提:需要保证配置好了三台装好hadoop的虚拟机hadoop102,hadoop103,hadoop104 下载地址 https://dlcdn.apache.org/spark/spark-3.2.0/spark-3.2.0-bin-hadoop3.2.tgz 条件 PYTHON 推荐3.8JDK 1.8 解压 解压下载的Spark安装包 tar…

春秋云境:CVE-2022-25578[漏洞利用]

通过题目标题查询漏洞信息 所以我们渗透的重点就要放在.htaccess文件上 这是一种分布式配置文件,所以我们先寻找web管理登录页面 打开主页就能看到右下角的“管理”,或者我们使用dirsearch进行扫描也可以 在登录页面尝试弱口令登录 输入该CMS相关的一…

几道练习题八

第 1 题 【 问答题 】 • 多项式相加 我们经常遇到两多项式相加的情况, 在这里, 我们就需要用程序来模拟实现把两个多项式相加到一起。 首先, 我们会有两个多项式,每个多项式是独立的一行, 每个多项式由系数、 幂数这样…

【游戏专区】贪吃蛇

1,游戏背景 贪吃蛇(Snake)是一款经典的电子游戏,最初在1976年由 Gremlin 公司开发。它的游戏背景相对简单,但具有高度的成瘾性。 1. **游戏场景**:通常在一个有界的矩形区域内进行,可以是一个…

关于Android绘制这一遍就够了

Android绘制基础 Android平台提供了一套完整的UI框架,其中包括了绘制组件和绘制API。在Android中,绘制主要涉及到两个核心概念:Canvas和Paint。 Canvas Canvas是Android中的一个类,它代表了绘图的画布。你可以在这个画布上进行…

Swift函数与闭包

一.Swift函数的定义与调用: Swift中的函数使用func关键字进行定义,语法如下: func 函数名(参数名1: 参数类型1, 参数名2: 参数类型2, ...) -> 返回类型 {// 函数体// 执行逻辑return 返回值 }其中,参数名和参数类型是可选的&…

Android Studio实现页面跳转

建立文件 temp.xml <?xml version"1.0" encoding"utf-8"?> <LinearLayout xmlns:android"http://schemas.android.com/apk/res/android"android:layout_width"match_parent"android:layout_height"match_parent"…

layui--table里使用switch

1. 项目需求 在layui.table上面渲染后的列表上面加一个switch开关&#xff0c;监听switch开关的动作&#xff0c;实现本列数据的状态切换&#xff01; 实现效果如下&#xff1a; 2. 实现方式 下面介绍的思路都是利用table的templet模板实现的&#xff0c;不同的在于模板代码…

Linux-内存文件

1. 基础IO操作 1.1 c语言的IO接口 fopen&#xff1a;打开一个文件&#xff0c;按照指定方式 参数&#xff1a;filename 文件名&#xff0c;也可以是路径&#xff0c;mode&#xff1a;打开方式 返回打开的文件指针 fread&#xff1a;从指定流中读数据 参数&#xff1a;从FIL…

Vuex 的原理

Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。每一个 Vuex 应用的核心就是 store&#xff08;仓库&#xff09;。“store” 基本上就是一个容器&#xff0c;它包含着你的应用中大部分的状态 ( state )。 Vuex 的状态存储是响应式的。当 Vue 组件从 store 中读取状态的…

没有理由不加倍努力

最近su7很火&#xff0c;各隐藏大佬都纷纷从后台来到前台&#xff0c;把整个网红界的网红等级提升了好几个档次。红衣大叔更是借此机会在疯狂地打造自己的网红IP。 千亿大佬都这还般努力&#xff0c;作为平民的自己哪还有不努力的理由。 加倍努力&#xff01;

29 共享内存

共享内存区是最快的IPC形式&#xff0c;一旦这样的内存映射到共享它的进程的地址空间&#xff0c;这些进程间数据传递不再涉及到内核&#xff0c;不再执行进入内核的系统调用来传递彼此的数据 原理 系统在内存中申请一段空间&#xff0c;通过页表映射挂接到进程的共享区&#…

Linux--链表 第二十五天

1. 链表 t1.next -> data t1.next->next->data .(点号)的优先级比->的大 所以 t1.next->data 就可以了 不用(t1.next)->data 2. 链表的静态增加和动态遍历 打印链表算法&#xff0c; void printLink(struct Test *head) { struct Te…

【前端面试常问】Promise与Async/Await

Promise与Async/Await &#x1f680; JavaScript中的两个重要概念——Promise和Async/Await&#xff0c;它们是我们处理异步编程时不可或缺的工具&#xff0c;让我们能够更优雅地驾驭回调地狱 &#x1f480;。 &#x1f31f; Promise 一个Promise对象代表了一个现在、将来或永…

Python机器学习项目开发实战:怎么处理图像内容分析

注意&#xff1a;本文的下载教程&#xff0c;与以下文章的思路有相同点&#xff0c;也有不同点&#xff0c;最终目标只是让读者从多维度去熟练掌握本知识点。 下载教程&#xff1a;Python机器学习项目开发实战_图像内容分析_编程案例解析实例详解课程教程.pdf Python在机器学习…

剑指Offer题目笔记32(拓扑排序)

面试题113&#xff1a; 解决方案&#xff1a; 将课程看成图中的节点&#xff0c;如果两门课程存在先修顺序那么它们在图中对应的节点之间存在一条从先修课程到后修课程的边&#xff0c;因此这是一个有向图。可行的修课序列实际上是图的拓扑排序序列。图中的每条边都是从先修课…

Web前端框架/库/工具

前言 前端从步枪&#xff08;原生js&#xff09;到了半自动武器&#xff08;jQuery&#xff09;并进化为全自动武器&#xff08;三大框架&#xff08;angular&#xff0c;react&#xff0c;vue及其生态链&#xff09;&#xff09;。 常说工欲善其事必先利其器。对于那些想要提…