探索Web开发的未来——使用KendoReact服务器组件

2024-01-21

Kendo UI 是带有jQuery、Angular、React和Vue库的JavaScript UI组件的最终集合,无论选择哪种JavaScript框架,都可以快速构建高性能响应式Web应用程序。通过可自定义的UI组件,Kendo UI可以创建数据丰富的桌面、平板和移动Web应用程序。通过响应式的布局、强大的数据绑定、跨浏览器兼容性和即时使用的主题,Kendo UI将开发时间加快了50%。

KendoReact 包含了React服务器组件,提供了DataGrid作为其第一个实验性的KendoReact服务器组件,让我们一起来看看!

Kendo UI R3 2023 SP1新版下载 (Q技术交流:726377843)

快速回顾

你有没有想过2023年Web的快速发展将如何塑造我们行业的未来?我们已经看到了基于Rust和Go构建工具的突破、Angular的品牌复兴、Svelte runes的发布,看起来React的下一个主要版本即将到来。

与世界各地的开发人员一起,Progress Telerik也在密切关注着Web的未来。当涉及到开发者体验时,不害怕玩弄实验性技术,并寻找创造性的方法来提高标准。

KendoReact服务器组件

今天我们想分享第一个实验性的KendoReact服务器组件——Grid(网格)~

RSC DataGrid是此次服务器组件的产品亮点,数据获取是RSC的主要内容。每个数据网格都提供基本的数据操作,如过滤、分页和排序、一些编辑功能,以及针对其核心结构元素(如行和单元格)的自定义API。

探索Web开发的未来——使用KendoReact服务器组件

事实证明,将组件拆分为服务器和客户端部分是非常具有挑战性的。通过从一些旧的、经过验证的框架中获得灵感,我们已经确定了为开发人员提供一种方法来定义客户端边界设置的必要性,这取决于他们的个人应用程序需求。

这个架构基础在后来的开发中获得了巨大的回报,因为它允许我们只将组件的一小部分JavaScript交付给客户端,与只针对客户端的DataGrid相比,它的包大小几乎小了10倍。

DataGrid(数据网格)中的数据

作为一个数据网格意味着它首先需要数据,但是 KendoReact Server DataGrid并不要求您立即拥有所有数据。

通过利用服务器组件的异步流功能,我们可以立即开始呈现组件外壳,使用基于组件状态的个性化加载指示器,直到数据可用。

最终的目的是,告诉我们你的数据在哪里,其余的由组件处理!

探索Web开发的未来——使用KendoReact服务器组件

这为将承诺作为数据传递、在不阻塞UI的情况下获取额外数据、甚至在组件内部直接传递SQL查询提供了机会。

探索Web开发的未来——使用KendoReact服务器组件

未来会有什么?

下一个版本的 KendoReact 将最终展示我们多年来为使服务器组件稳定、高性能和安全所做的努力,但在此之前,我们对React UI库和第三方组件供应商将如何形成持开放态度。

准备好尝试一下KendoReact服务器网格了吗?点击这里可以 立即下载体验>>

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

探索Web开发的未来——使用KendoReact服务器组件 的相关文章

  • React Native 中 fontAwesome 图标的圆形轮廓

    我想使用 fontAwesome 图标 使其位于圆圈的中间 我想将它用作一个图标项 我读到我们可以将它与圆形图标一起使用并将其放置在其中 但我无法使其工作 import IconFA from react native vector ico
  • 鼠标输入时反应显示按钮

    我有一个反应组件 它包含如下方法 mouseEnter console log this is mouse enter render var album list const albums this props if albums user
  • 如何使用 React 制作垂直选项卡

    有人可以为我提供一种使用 React 创建垂直选项卡的方法吗 我尝试了各种npm包 如react web tabs reactstrap和react bootstrap 最后两个只有水平选项卡的示例 React web tabs在其文档中有
  • Firebase setDoc() 不创建文档

    我正在使用 auth 创建一个新用户 该用户正在工作 然后使用新创建的 uid 创建一个具有相同内容的新文档 const currentUser await auth createUserWithEmailAndPassword email
  • 如何使用 Firestore 中的对象数组更新 Field 中的特定对象? [关闭]

    Closed 这个问题正在寻求书籍 工具 软件库等的推荐 不满足堆栈溢出指南 help closed questions 目前不接受答案 所以我有一个emojiCounter字段用于存储对象数组 例如 emojiCounter emoji
  • 有没有办法显示嵌套在 Grid 组件内的 Material-UI 抽屉?

    我正在使用 Material UI 创建一个 Web 应用程序 主页分为 3 个网格 每个网格有一个height of 500px 我想在中间网格内显示一个带有一些操作选项的抽屉 那可能吗 到目前为止 我只能在整个屏幕上显示它 这是我的主要
  • 发生错误。", ExceptionMessage: "提供的 'HttpContent' 实例无效

    尝试将文件添加到 http 休息调用时出现此错误 responseJson 消息 发生错误 ExceptionMessage 提供了无效的 HttpContent 实例 它确实 正在使用 多部分 参数名称 内容 异常类型 System Ar
  • Recoil 中的动态原子键

    我正在尝试创建一个动态表单 其中表单输入字段是根据 API 返回的数据呈现的 由于atom需要有一个唯一的键 我尝试将它包装在一个函数中 但是每次我更新字段值或重新安装组件 尝试更改选项卡 时 我都会收到一条警告 我在这里做了一个小的运行示
  • Material UI 组件中的媒体查询

    我在 React js 项目中使用 Material UI 组件 出于某种原因 我需要对某些组件进行自定义 以使其根据屏幕宽度进行响应 我已经添加了media query并将其作为组件中的样式属性传递 但不起作用 知道吗 我正在使用这样的代
  • 哪种反应钩子与 firestore onsnapshot 一起使用?

    我在我的 React Native 应用程序中使用了大量的 Firestore 快照 我也在使用 React hooks 代码看起来像这样 useEffect gt someFirestoreAPICall onSnapshot snaps
  • 运行故事书时出错 - sh: 1: start-storybook: 未找到

    我运行时遇到错误故事书 即使是干净的安装 npm run storybook gt storybook media programmersedge New Volume devs demostorybook gt start storybo
  • AWS JS SDK TypeError:STS 不是构造函数

    我有一个 ReactJS 应用程序 它使用 aws sdk 进行认知登录 我用了yarn安装所有模块 但是当我尝试访问 localhost 的网站时 出现 JS 错误 未捕获 承诺中 类型错误 STS 不是构造函数 错误指向该行aws sd
  • React this.state 未定义?

    我正在遵循 Pluralsight 的初学者教程 在表单提交时将值传递给addUser组件方法 我需要将 userName 推送到this state users但我收到错误 App jsx 14 Uncaught TypeError Ca
  • ReactJS 水平对齐material-ui 元素

    我试图在文本输入旁边有一个单选按钮 这样用户基本上可以输入问题的 答案 并标记一个首选答案 然而 Material UI 将每个都放在自己的行上 这就是我目前所拥有的 div div
  • 如何将 hls.js 与 React 结合使用

    我需要一些帮助来尝试弄清楚如何在 React 中使用 hls js 让我解释一下我必须从 api 获取 m3u8 的情况我能够使用基本的 html 使其工作
  • s3 中托管的静态网站:页面刷新后返回 404

    使用此存储桶策略 Version 2012 10 17 Statement Sid PublicReadGetObject Effect Allow Principal Action s3 GetObject Resource arn aw
  • 语法:const {} = 变量名,任何人都可以解释或指出我正确的方向[重复]

    这个问题在这里已经有答案了 这个语法在 JavaScript 中意味着什么 可能是 ES6 const 变量名 我目前正在尝试掌握 React 在很多例子中我都遇到过这种语法 例如 const girls guys women men st
  • React 中的变异状态有哪些缺点?

    我有一个带有顶级组件和许多嵌套子组件的 React 应用程序 顶级组件是唯一具有状态的组件 该状态采用单个变量的形式 this state g new BlackJackGame g 包含一个复杂的数据结构 class BlackJackG
  • 样式化组件:如何针对直系儿童?

    我在文档中看到 选择器用于嵌套定位 但以下不起作用 这里使用的正确语法是什么 const InlineContainer styled div display flex gt margin right 40px 作为 CSS 值 字符串 4
  • 在 React Web 应用程序中使用 createjs-soundjs

    我想用https www npmjs com package createjs soundjs https www npmjs com package createjs soundjs在 React Web 应用程序上播放声音 我正常安装了

随机推荐

  • RubyMine for Mac/win:提升Ruby和Rails开发的强大IDE

    随着Ruby和Rails在Web开发领域的广泛应用 一款高效的开发工具对于提高生产力至关重要 JetBrains RubyMine正是这样一款值得信赖的集成开发环境 IDE 作为Mac和Windows平台上的强大工具 RubyMine为开发
  • U3D游戏开发中摇杆的制作(UGUI版)

    在PC端模拟摇杆 实现玩家通过控制摇杆让玩家移动 以下是完整代码 using System Collections using System Collections Generic using UnityEngine using Unity
  • U3D游戏开发中摇杆的制作(NGUI版)

    在PC端模拟摇杆 实现控制摇杆让玩家或者物体移动 以下是完整代码 using System Collections using System Collections Generic using UnityEngine public clas
  • 游戏开发常见操作梳理之NPC任务系统

    多数游戏存在任务系统 接下来介绍通过NPC触发任务的游戏制作代码 using System Collections using System Collections Generic using UnityEngine
  • 游戏开发创建操作之玩家信息系统的建立

    游戏一般都需要玩家信息系统 那么我们应该如何搭建玩家信息系统 接下来我将展示一种简单的方法 完整代码如下 using System Collections using System Collections Generic using Uni
  • iStat Menus:Mac用户的系统状态守护者

    iStat Menus 一款为Mac用户精心设计的系统状态监控工具 致力于为用户提供关于系统性能 硬件状态和网络活动的实时信息 它不仅是一个监控工具 更是一个守护者 始终守护着Mac系统的安全与稳定 通过直观的仪表盘风格 iStat Men
  • 游戏开发常见操作梳理系列之——玩家信息的显示系统

    在游戏中 有不少游戏在左上角会出现玩家的头像和等级以及血量 这就是玩家的信息显示系统 那么这些是如何制作的呢 接下来我将讲讲代码的操作 其它操作我会在其它笔记中一一说明 敬请期待 信息的显示相当简单就是控制一些UI 然后在其它系统里面填写相
  • 提升编程效率,Sublime Text 4 for Mac 让代码编辑更高效!

    作为一名开发人员或程序员 一个高效且功能强大的文本编辑器是必不可少的工具 而 Sublime Text 4 for Mac 正是为满足这一需求而设计的 无论你是初学者还是经验丰富的专业人士 Sublime Text 4 都将成为你编程生涯中
  • 游戏开发常见操作梳理之NPC药品商店系统(NGUI版)

    后续会出UGUI Json的版本 敬请期待 游戏开发中经常会出现药品商店 实际操作与武器商店类似 甚至根据实际情况可以简化设置 废话不多说 直接上代码 药品商店的源码 using System Collections using Syste
  • 揭秘网络世界的幕后密码——Wireshark网络协议分析软件

    在我们日常生活中 计算机和互联网已经成为不可或缺的一部分 然而 很少有人真正了解网络背后复杂的工作原理和通信协议 幸运的是 有一款强大而实用的软件 Wireshark 可以帮助我们深入了解网络世界的幕后密码 Wireshark是一款免费的网
  • 解锁思维潜能,畅享XMind 2024 Mac/win中文版思维导图软件

    XMind 2024是一款功能强大的思维导图软件 旨在帮助用户提高工作效率和组织思维 它的核心特点包括多平台同步 强大的协作功能和丰富的导图模板 首先 XMind 2024支持多平台的无缝同步 用户可以在电脑 手机和平板上随时随地访问和编辑
  • 游戏开发常见操作梳理之小地图的制作

    游戏中一般存在小地图系统 实际上就是设置一个新的摄像机放置在玩家的正上方 然后在小地图上显示新摄像机看见的东西就可以了 在小地图上一般存在放大地图和缩小地图的按钮可以方便放大和缩小地图 这些操作是如何实现的呢 接下来直接上核心代码 usin
  • 用Growly Draw for Mac,释放您的创意绘画天赋!

    在数字化时代 绘画已经不再局限于传统的纸笔之中 如今 我们可以借助强大的绘画应用软件 将创意化为独特的艺术作品 而Growly Draw for Mac就是一款让您能够快速释放创意 创作精美绘画作品的应用软件 Growly Draw for
  • 游戏开发之常见操作梳理——武器装备商店系统(NGUI版)

    游戏开发中经常出现武器商店 接下来为你们带来武器装备商店系统的具体解决办法 后续出UGUI Json版本 敬请期待 武器道具的具体逻辑 using System Collections using System Collections Ge
  • 游戏开发常见操作梳理之角色选择一

    进入游戏后 我们经常会进入角色选择的界面 通常是左右两个按钮可以更改角色供玩家选择 对于这种界面我们通常使用数据持久化将角色信息存储起来 接下来的笔记中 我将使用自带的数据持久化系统对其进行操作 实现角色的选择页面 后续会更新xml系列的文
  • Effective C++——尽可能使用const

    const允许指定一个语义约束 也就是指定一个 不该被改动 的对象 而编译器会强制实施这项约束 只要保持某个值不变是事实 就应该说出来 以获得编译器的协助 保证不被违反 const与指针 注意const的写法 const char p p可
  • 游戏开发常用实践操作之按动任意键触发

    接下来一些笔记会对于一些大大小小的实践操作进行记录 希望对你有所帮助 在游戏中 我们经常会遇到一些按动任意键触发的操作 接下来展示核心代码 以下是对于Unity中的操作 使用的UI是NGUI 对于核心操作没有影响 你可以自己置换 void
  • 游戏开发常见操作系列之敌人系统的开发一(U3D)

    在开发游戏的过程中 我们常常会出现一些敌人攻击我们玩家 并且实现掉血以及死亡的现象 敌人还会源源不断地生成 这是怎么制作的呢 接下来为大家提供方法 其中使用了NGUI 后续会更新其它方法 敬请期待 使用HUDText实现扣血时显示文本 直接
  • 【C++】static_cast和dynamic_cast使用详解

    目录 一 static cast 二 dynamic cast 三 总结 如果这篇文章对你有所帮助 渴望获得你的一个点赞 一 static cast static cast 是 C 中的一种 类型转换操作符 用于执行编译时的类型转换 它主要
  • 探索Web开发的未来——使用KendoReact服务器组件

    Kendo UI 是带有jQuery Angular React和Vue库的JavaScript UI组件的最终集合 无论选择哪种JavaScript框架 都可以快速构建高性能响应式Web应用程序 通过可自定义的UI组件 Kendo UI可