文档建议反馈控制台
首页
学习
活动
专区
工具
TVP
最新优惠活动
文章/答案/技术大牛
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

图扑数字孪生智慧机场，助推民航四型机场建设

全要素、立体化、多角度的展现机场运转的上下游依赖关系，解决了当前机场可能无法抵挡吞吐量逐年快速增长的局面下，所导致的 Ｕ 形停机坪区域动态跟踪质量不高、作业人员核对信息工作量大，数据共享程度较低欠缺支撑...停机坪可视化 点击面板中的停机坪状态，切换视角至停机坪视角，查看停机坪内停留飞机的相关运营状态（工作中/已计划/空闲中）。...图扑以多样化 2D、3D 组态图表，基于空间、时间、指标等多维度数据，对航站楼目标因素运行数据进行图形化和可视化。支持数据动态加载，以简洁明了的面板形式呈现于场景两侧。...当通行信息异常时，可视化大屏将迅速发出预警信息，同步给运维人员，并定位至现场，同时为边检人员提供可用的“空闲中”自助通道方案。全面优化边检通道的服务水平，大幅度提升旅客服务体验。...通过整合边检各项检验系统数据，对查验人数、人流量、乘客数量、目的地等信息予以动态监控。

1.7K20
您找到你想要的搜索结果了吗？
是的
没有找到

干货 | 已配置4000+页面，携程前端组件化探索之“乐高”运营系统

在特殊活动中，我们也会采用乐高现有组件搭配定制活动业务组件的形式，不仅丰富活动的形式，还能节省大量开发时间。 特点：UI可配置，业务逻辑完整。在乐高都要有完整的后台流程，数据结构。 ?...3.4 其他（特殊类） 定位组件拆分 有时候模块并不是独立业务组件的简单配置堆叠，在实际配置中需要有数据通信，交互关联，逻辑自定义等情况。...tab模块切换 用来控制其他组件（所有类型）是否渲染的”tab模块切换“组件。...乐高上已经有很多业务+UI可复用的组件（如刚才这个大转盘），“乐高”大转盘有一整套基于大转盘抽奖的流程，数据结构，能不能直接复用这些呢，或者说能够在任何一个页面中嵌入乐高的更多其他组件呢？...另外我们也在做基于公司的NFES框架（React技术栈）做组件的改造，在首屏性能上，组件拆分，组件复用，国际化，SEO等方面做提升。

2K30

《精通reactvue组件设计》之5分钟教你实现一个极具创意的加载(Loading)组件

正文 在开始组件设计之前希望大家对css3和js有一定的基础,并了解基本的react/vue语法.我们先看看实现后的组件效果: ? ? ?...首先我们设计的不是后台管理系统专用的加载动画,而是作为一个C端产品的功用型加载动画.我们都知道加载动画的作用是:在用户等待网页时能看到有用的信息,比如网站介绍,引导, 公司信息等,缓解用户焦虑....策略型加载动画往往用在C端产品或者系统中,用来为用户提供更多的引导信息, 当用户首次访问系统或者网站时, 由于某种主动型引导(网站在加载时或者切换页面时故意给用户看到的加载信息)或者环境原因(网络,带宽限制导致的加载过慢... : null } 自定义的引导内容这里我就不介绍了, 主要根据不同的网站性质灵活配置.我主要介绍加载动画部分, 其实原理也很简单, 我们在skeletonContent...这块也涉及到一个知识点, 因为加载文本其实主要是用来修饰元素的,并没有太多的语义化场景, 所以我们会放在::after伪对象的content里, 但是一般content是在css里写的,那么如何实现动态文本呢

94620

记一次 「 无限滚动 」列表优化

如图所示： 快速滚动出现空白 作为对比，看一下优化后的效果： 优化之后 问题定位 在chrome调试工具下，边拖动列表边观察dom的变化。...file=/src/animation.tsx 动态演示： 这里渲染了1000 条记录， 每条记录里有5个select; 默认使用的是 antd Select, 几乎拉不动； 切换到原生select之后...通过Observer来观测其是否在可视区域中，如果在，那么就往下加载更多的内容： 初始状态时，列表会多渲染几条数据（两屏数据），observer-dom元素一直被顶到底部....用户往下滚动时，observer-dom元素“出现”在用户视野。 每次多加载一屏的数据，循环如此，直到整个列表都渲染到页面上。...无论是选择虚拟长列表or下拉懒加载，在使用监听scroll事件或者Intersetion Observer API之间的取舍时，可以参考： scroll的事件回调会在主线程中被成千上万次调用，尽管加了防抖

3.1K20

2020前端性能优化清单（四）

( "动态import()支持")支持")延迟加载部分 UI，避免在用户真正需要它们之前因为加载、解析和编译造成的成本消耗（感谢Addy！）。...如果出现超过 50ms 的任务，对5秒窗口的搜索将重新开始。因此，浏览器首先会假定它是可交互的，只是为了切换到冻结状态，只是为了最终切换回可交互状态。...客户端预渲染 与服务器端预渲染相似，但不是在服务器上动态渲染页面，而是在构建时将应用程序渲染为静态 HTML。...正如 Yoav Weiss 在关于第三方脚本的必看演讲[51]中所解释的那样，在许多情况下，这些脚本会下载动态资源。...通常，资源应该可以在很短的时间内（如果可能会更改）或无限期（如果它们是静态的）[64]缓存，你可以在需要时在 URL 中更改其版本。

3.3K20

干货 | 携程活动搭建平台的前端“开放性”建设探索

首先需要改造组件的最终形式，使其可以接收公共依赖（react，react-dom，公共依赖等），这时可以修改默认打出的UMD自执行函数，使其返回一个普通函数，“依赖”可以通过渲染引擎在解析时通过“形参”...实现方法是在自定义plugin中，接管组件的打包过程，替换依赖部分的代码，将真正需要的依赖如react，react-dom等以形式参数的“代码字符串”写入到组件文件里面，最终通过替换字符串代码改写组件构建的结果...将字符串文件转换为内存变量module，即而完成服务端的渲染，而客户端则动态加载这些异步js，完成客户端的渲染。...能够做到“动态资源，实时拉取，按需加载”，使“乐高组件”能够无缝渲染到其他页面。...动态表单孵化于建设平台过程中，是一种可视化在线配置动态表单方案，专注于解决通用常规表单的可视化自由配置，目前能够解决大部分的常规表单的在线配置场景，支持数据联动、复杂数据嵌套、拖拽布局等。

1.1K20

微前端x重构实践落地总结

升级版架构 上图的架构有一个问题就是，当每次点击侧边栏的 MenuItem 时，都会加载一次微应用的子页面，也即： 微应用子页面之间的切换，其实就是在微应用里路由切换嘛，大可不需要通过重新加载一次微应用来做微应用子页面的切换...当在切换新页面时，本质上是在子应用里做路由切换，而不是从 A 应用切换到 B 应用了。...，这是因为 qiankun 在加载微应用时，会执行这部分 JS 代码，而此时 var 声明的变量不再是全局变量，其他的文件无法获取到。...这是因为在主应用切换路由时不是通过 location.url 这种可以触发 hash change 事件的方式来变更路由，而 react-router 只监听了 hash change 事件，所以当主应用切换路由时...微前端就可以解决重构的过程中边做新需求边重构的问题，使得新老页面都能共存，不会一下子整个业务都停掉来做重构工作。

99220

React Native调试心得

在做React Native开发时，少不了的需要对React Native程序进行调试。调试程序是每一位开发者的基本功，高效的调试不仅能提高开发效率，也能降低Bug率。...提示：如果Command⌘ + R 无法使你的iOS模拟器加载js，则可以通过选中Hardware menu中Keyboard选项下的 “Connect Hardware Keyboard” 。...在 Developer Menu中你会看到”Enable Live Reload” 选项，该选项提供了React Native动态加载的功能。...添加和移除断点 在 Sources 面板的文件导航面板中打开一个JavaScript文件来调试，点击边栏(line gutter) 为当前行设置一个断点，已经设置的断点处会有一个蓝色的标签，单击蓝色标签...在输入框中，输入一个可解析为真或假的表达式。仅当条件为真时，执行会在此暂停。  ? 心得：如果你想让程序在某处从来都不要暂停，可以编辑一个条件永远为false的条件断点。

5K70

『React Navigation 3x系列教程』createMaterialTopTabNavigator开发指南

当为 false 时，所有的 Tab 页都将直接被渲染；（可以轻松实现多Tab 页面的懒加载）； optimizationsEnabled -是否将 Tab 页嵌套在到 中。...Page3的时候传递了参数{ name: 'Devio' }； 【高级案例】react-navigation的高级应用 在使用react-navigation时往往有些需求通过简单的配置是无法完成的...动态配置createMaterialTopTabNavigator的样式：通过官方的文档是无法实现动态改变TabNavigator的样式的，比如：修改显示的文字，修改字体颜色，修改图标等等； 多层嵌套后路由个性化定制...：createMaterialTopTabNavigator被包裹后在TabNavigator中的页面是无法借助navigation跳转到外层StackNavigator中的页面的，这种应用场景很多，尤其是你需要定制...大家在学习使用React Navigation3x过程中遇到任何问题都可以在React Navigation3x的视频教程中寻找答案哈。

12.6K20

TDesign 更新周报（2022年7月第3周）

场景下 keys 无效的问题Table:修复多级表头表格中，列配置全选功能选不全的问题修复可选中行 table 组件，data 为空数据时，默认全选按钮会选中的问题兼容IE滚动条高度计算覆盖不全问题修复树形结构懒加载顺序问题可编辑单元格...Table: 拖拽调整宽度，非边框模式，悬浮到表头时，显示表头边框 Bug FixesTable: 修复可编辑单元格，校验失败的信息无法清除问题Table: 树形结构，修复树形结构懒加载顺序问题Swiper...: 列宽拖拽，拖动到边界处后无法再次拖动Table: 多级表头场景下的多选，无法全选Table: 修复可选中行 table 组件，data 为空数据时，默认全选按钮会选中的问题InputNumber:...iconfont高级用法由于t-icon的干扰导致渲染异常的情况table: 修复可选中行table组件，data为空数据时，默认全选按钮会选中的问题table: 列宽拖拽调整到边界时无法重新调整table...: 多级表头场景下的列配置，无法全选Pagination: 修复左右切换禁用失效问题table: 修复树形结构，懒加载顺序问题TagInput: 修复hover时组件换行的样式异常drawer: 修复开启

2.7K30

重构的些许收获

很多地方基本没怎么管代码规范，直到一期完毕回过头来看之前写的代码，不忍直视。为了之后接手的人能更加轻松，也为了自己之后debug更加顺手，边开始二期的部分需求，边重构一期的部分代码，还是有部分收获。...项目技术栈是： nodejs javascript react redux react-router webpack 之前的架构是react-router2，后面换成了react-router4。...API层 目前 tools.buildParams(parameters) 这一块的传参还在纠结以对象传还是以数组传，以数组传直接传 arguments 就可以，缺点是传参以黑盒来传，无法判断参数，无法快速...缓存 统一缓存命名规范，防止缓存冲突 Feature 模块按需加载，自定义各模块间通信机制 模块注册脚手架，前端接入提供注册工具，模块单独部署，动态注册，独立 CDN。...编译由服务端统一执行 服务端项目代码自身预编译，提高执行性能、降低部署风险 编译结果统一保存，支持按分支名切换、回滚 Flag 还有很多好玩的东西可以搞，每一次的优化都是对自身的一次重构。

593100

React Native调试技巧与心得

本文出自《React Native学习笔记》系列文章。 在做React Native开发时，少不了的需要对React Native程序进行调试。...提示：如果Command⌘ + R 无法使你的iOS模拟器加载js，则可以通过选中Hardware menu中Keyboard选项下的 “Connect Hardware Keyboard” 。...在 Developer Menu中你会看到”Enable Live Reload” 选项，该选项提供了React Native动态加载的功能。...添加和移除断点 在 Sources 面板的文件导航面板中打开一个JavaScript文件来调试，点击边栏(line gutter) 为当前行设置一个断点，已经设置的断点处会有一个蓝色的标签，单击蓝色标签...在输入框中，输入一个可解析为真或假的表达式。仅当条件为真时，执行会在此暂停。 ? 心得：如果你想让程序在某处从来都不要暂停，可以编辑一个条件永远为false的条件断点。

6.7K50

干货 | 加载速度提升15%，携程对RN新一代JS引擎Hermes的调研

在分析性能数据时，Facebook团队发现 JavaScript 引擎是影响启动性能和应用包体积的重要因素。...在携程App中，拿门票业务做了验证，在做了预加载的情况下，首屏加载速度依然可以提升约15%。而V8的表现就非常糟糕了。...六、Hermes引擎的动态性 另外通过我们的测试，Hermes在执行字节码和文本JS上有一些很有意思的特性，这些特性让升级成本变得非常低： Hermes支持执行纯文本的js 支持动态加载纯文本js或者bytecode...在加载的时候可以先加载a.hbc文件，然后加载b.js文件。可正常执行。...另外，动态下发RN增量包时，由于是二进制文件diff，差分效率极低。

4.9K40

精读《React Router4.0 进阶概念》

代码分割 通过 react-loadable，可以做到路由级别动态加载，或者更细粒度的模块级别动态加载： const AsyncHome = Loadable({ loader: () => import...ReactRouter 中的用法，AsyncHome 可以在任何 JSX 中引用，这样就提升到了模块级别的动态加载。...，React Router 无法根据 location 自动判断当前所在页面，而需要你把 req.url 传给 StaticRouter，后续的路由渲染逻辑双端都是通用的。...URL 即浏览器地址，在前端数据化统一的浪潮下，其实 URL 也可以被看作是一种参数，在 React 中即一个 props 属性。...当我们做一个 Tabs 组件时，会发觉做得越来越像浏览器原生 tab，当用户给你提需求，在刷新浏览器时，能自动打开上一次打开的 Tab，我们的做法就是将当前打开的 Tab 信息保存在 URL 中，刷新时读取再切换过去

85510

React 轮播动画探索

但幻灯片切换效果不佳并不是最主要的，更重要的还是氛围气泡业务逻辑的实现，我们看看结合 push 命令，动态更新幻灯片数量的情况下，swiper 在 react 中的状态管理会变得多不堪。...另一个问题 —— 基于 swiper 动态更新氛围气泡 在实际业务使用中，其实还遇到了优先级展示的问题，氛围气泡的位置一共有三个组件在轮流展示： 打开直播间，先展示一段 5s 的课程公告 公告消失后，如果有氛围气泡数据...prependSlide('new Slide'); }; 从这里就能看出来，在 react 中，如果需要动态更新幻灯片的场景，使用 swiper...为了与 React 中的 className 进行区别，classNames 这个参数在 className 的基础上在末尾加了个 s。...swiper 相对不太适合 react 的状态管理，在需要动态增删幻灯片的场景，它依赖于实例方法，不易做到数据同步。 4.3.

2.4K10

TDesign 更新周报（2022年7月第2周）

属性透传无效Transfer: 修复穿梭框进行穿梭时报错的问题Table: 树形结构支持懒加载Dialog: 修复打开对话框时出现滚动条的问题DatePicker: 修复日期格式化问题TimePicker...: 优化允许输入滚动的使用体验TimeRangePicker 修复允许输入的缺陷Select: 修复远程搜索动态生成选项失败的缺陷虚拟滚动支持远程搜索场景Dialog: 修复阻止冒泡导致 popup 无法正常关闭...为布尔值时丢失响应性问题Select: 多选下 hover 出现换行的异常Dialog: 内部样式未使用prefix导致替换前缀方式的样式丢失Input: autoWidth 在部分场景下失效导致组件样式异常...Drawer: 修复开启 destroyOnClose 之后，没了动画效果TreeSelect: 修复异步加载回显展示问题Textarea: 修复无法传入 attrs 中的 style详情见：https...Bug FixesTable: 可编辑功能，值为 null 时会导致页面报错，如清除 Select 数据Dialog: 修复 dialog 阻止冒泡导致 popup 无法正常关闭Input: 修复在

2.2K10

那些React-Native踩过的的坑

这几天开始边学边做新模式，也踩了不少坑，所以会记录下来--俗话说好记心不如烂笔头，何况还没有一颗好记心（-_-）。    .../38831876#38831876 0x02 布局页面中的某个部分频繁刷新    我这边做一个ListView中的一些item的需要倒计时显示，一开始我把他放在整个item的render布局中然后发现加载...5个定时器的时候切换页面的时候特别卡，后面尝试把页面切换的时候把定时器移除（一开始认为切换后再回来页面会重新创建），但是发现其实不会。...0x03 关于state的实用用法   在react-native中state代表动态改变值的状态，但如何应用到开发中是一个关键点？  ...然后若点击播放           1按钮改变按钮图标           2播放进度条开始往前走 0x03 关于react-native中ListView加载数据细节     页面中经常会有上拉加载数据的情况

1.9K90
点击加载更多

扫码

添加站长 进交流群

领取专属 10元无门槛券

手把手带您无忧上云

扫码加入开发者社群

相关资讯

热门标签

更多标签

活动推荐

    运营活动

    活动名称
    广告关闭

    腾讯云开发者

    扫码关注腾讯云开发者

    扫码关注腾讯云开发者

    领取腾讯云代金券

    热门产品

    热门推荐

    更多推荐

    Copyright © 2013 - 2024 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有

    深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 深公网安备号 44030502008569

    腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号 | 京公网安备号11010802020287

    领券