- 博客(50)
- 收藏
- 关注
RSS订阅原创 three.js 渲染调优，提升3d场景更逼真的渲染效果
我们渲染采用最为专业的ACES色调映射（也是UE里面默认的色调映射），也只有ACES支持虚幻功能，虚幻绽放亮度。再然后我们需要把色彩空间编码改成THREE.sRGBEncoding即可。在着色器中色值的提取与色彩的计算操作一般都是在线性空间。在webgl中，贴图或者颜色以srgb传入时，必须转换为线性空间。计算完输出后再将线性空间转为srgb空间。linear颜色空间：物理上的线性颜色空间，当计算机需要对sRGB像素运行图像处理算法时，一般会采用线性颜色空间计算。
2024-07-08 19:02:32
930
原创 ChatGPT：流式数据输出的原理与SSE技术
ChatGPT的流式输出，指的是在与用户进行对话时，ChatGPT能够实时地、连续地输出文本内容，而不是等待整个回答完全生成后再一次性输出。这种流式输出的方式，使得ChatGPT的响应更加迅速，用户体验更加流畅。SSE，全称Server-Sent Events，是一种基于HTTP协议的服务器推送技术。它允许服务器主动向客户端发送数据和信息，实现了服务器到客户端的单向通信。ChatGPT的流式输出功能是一项具有重要意义的技术创新，它为用户提供了更加高效、智能的对话体验。
2024-07-08 18:35:33
1043
原创 React中的useCallback
是一个强大的Hook，用于优化React应用的性能，通过避免不必要的函数重新创建和子组件渲染。使用时，应合理选择依赖项，以确保函数在需要时更新。与useMemo相比，专注于函数记忆化，而useMemo则用于计算结果的记忆化。理解两者的区别和适用场景，可以帮助开发者更有效地优化React应用。useMemo和memo 介绍React中的useMemo和memo-CSDN博客。
2024-07-07 21:58:59
620
原创 React中的useMemo和memo
React是一个声明式的JavaScript库，用于构建用户界面。在开发过程中，性能优化是一个重要的方面。useMemo和memo是React提供的工具，用于帮助开发者避免不必要的渲染和计算，从而提升应用性能。
2024-07-07 21:53:02
931
1
原创 前端需要了解的HTTP缓存知识
HTTP缓存是一种用于提高网站性能和减少带宽使用的技术。当用户访问一个网页时，浏览器会下载页面上的所有资源（如HTML、CSS、JavaScript等），这些资源会占用大量的带宽和时间。为了减少这些资源的加载时间，HTTP缓存机制被引入。缓存分为和两种，强缓存不能缓存地址栏访问的文件，协商缓存可以缓存地址栏访问的文件。
2024-05-19 16:32:00
1115
原创 关于vue3中使用cesium
此篇文章是描述关于在vue3中使用cesium的方法和教程；最早的时候关于vue中使用cesium是很混乱的，教程也很少只能挨个踩坑。最近个人又使用了一下，现在还是比较完善的。下面进入正题，希望对一些从事webGIS开发者有所帮助。
2024-05-19 16:11:12
793
原创 TypeScript 中，泛型和接口之间有什么联系和区别？
在TypeScript中，泛型和接口是两种不同的概念，但它们可以一起使用来增强代码的类型安全性和灵活性。下面我们来探讨它们之间的联系和区别。类型安全性：泛型和接口都用于提高代码的类型安全性。通过使用泛型和接口，你可以在编译时捕捉到类型错误。可重用性：它们都可以提高代码的可重用性。泛型允许你定义可以操作多种类型的函数和类，而接口则可以定义一个对象的结构，这个结构可以被多种类型的类实现。组合使用：泛型可以与接口结合使用，创建出更加灵活和强大的抽象。例如，你可以定义一个泛型接口，它约束了实现类必须拥有的属性和方法
2024-05-05 13:02:39
780
原创 TypeScript 泛型：深入理解与应用
泛型是TypeScript的强大特性，它提供了一种定义和使用通用数据结构的方式。通过泛型，你可以编写更灵活、更安全、更可读的代码。理解并掌握泛型，对于任何TypeScript开发者来说都是至关重要的。希望这篇文章能帮助你更好地理解TypeScript泛型的使用和应用。如果你有任何问题或想要更深入的讨论，欢迎在评论区交流。（下一篇：在 TypeScript 中，泛型和接口之间有什么联系和区别？
2024-05-05 12:54:07
741
原创 Web Workers 介绍
Web Workers 提供了一种在 Web 页面中执行后台任务的有效方式，它通过创建独立的线程来运行脚本，从而不会阻塞用户界面。通过使用 Web Workers，你可以提高网页的响应性，尤其是在处理复杂计算或长时间运行的任务时。然而，使用 Web Workers 也需要考虑线程间的通信开销，以及可能引入的复杂性。正确地管理 Workers 和线程间的通信对于构建高效的 Web 应用也是至关重要的。
2024-05-01 12:51:21
699
1
原创 前端之实现大文件上传的解决方案———断点续传
断点续传是一种在网络传输中提高效率和可靠性的技术，特别适用于大文件的上传和下载。文件分片：将大文件分割成多个小块，这允许并行上传和从中断处恢复。并行上传：通过同时上传多个文件块，可以提高整体的上传速度。校验和记录：每个文件块在上传前后都进行校验，以确保数据的完整性。同时，记录已成功上传的块，为断点续传提供依据。请求恢复：当传输中断时，客户端使用记录的信息请求从最后成功上传的块继续上传。服务器支持：服务器端需要能够接收分片数据，验证块的完整性，并支持断点续传的逻辑。
2024-05-01 12:41:06
1893
2
原创 Node.js 中的 RSA 加密、解密、签名与验证详解
RSA算法作为一种非对称加密技术，在保障数据传输安全方面发挥着重要作用。Node.js提供了内置的crypto模块和第三方库node-rsa，使得在Node.js环境中实现RSA加密、解密、签名和验证变得简单易行。开发者可以根据项目需求和环境选择合适的工具进行数据加密和安全保护。
2024-04-14 17:34:22
3730
原创 Node.js 并发控制
Node.js 的并发控制主要依赖于事件循环和非阻塞 I/O，通过使用 Promises、async/await 以及子线程等技术，可以有效地处理高并发场景。开发者应根据实际需求选择合适的并发解决方案，以提高应用程序的性能和响应速度。随着 Node.js 的不断发展，未来可能会出现更多高效的并发处理方案。扩展：使用cluster模块可以显著提高 Node.js 应用程序的并发处理能力，特别是在多核 CPU 服务器上。通过创建多个工作进程，你可以让每个核心都参与到请求处理中，从而提高整体的处理速度和效率。
2024-04-14 17:18:23
1281
原创 深入理解 Golang 中 New() 和 make() 的区别
new()new(T)用于分配内存并返回指向类型T零值的指针。它适用于所有可以被分配的类型。用于创建切片、映射和通道，并返回初始化后的实例。它不适用于所有类型，只适用于它支持的三种引用类型。new() 用于创建任意类型的变量，而 make() 专门用于创建引用类型的变量。new() 返回指向指定类型的零值的指针，而 make() 返回指定引用类型的初始化值。使用 new() 创建的变量设置为它们的零值，而使用 make() 创建的变量根据其类型进行初始化。
2024-04-12 22:09:55
1086
原创 从前端角度防范XSS攻击的策略与实践
防范XSS攻击是一个复杂的过程，需要开发者在前端开发中始终保持警惕。通过输入验证、输出编码、合理设置HTTP头部以及利用现代前端框架和库提供的安全特性，可以大大降低XSS攻击的风险。然而，安全是一个不断发展的领域，开发者应该持续关注最新的安全研究和最佳实践，以保护用户和数据安全。
2024-04-12 21:58:19
1196
原创 go 指针和内存分配
了解指针之前，先讲一下什么是变量。每当我们编写任何程序时，我们都需要在内存中存储一些数据/信息。数据存储在特定地址的存储器中。内存地址看起来像0xAFFFF（这是内存地址的十六进制表示）。现在，要访问数据，我们需要知道存储它的地址。我们可以跟踪存储与程序相关的数据的所有内存地址。但想象一下，记住所有内存地址并使用它们访问数据会有非常困难。这就是为什么引入变量。变量是一种占位符，用于引用计算机的内存地址，可理解为内存地址的标签。什么是指针指针是存储另一个变量的内存地址的变量。
2024-04-04 12:25:36
1254
原创 React之Diff 算法
在 React 中，通过 React.createElement 也能生成一个虚拟 DOM 节点（ReactElement）。在 React15 及以前，采用了递归的方式创建虚拟 DOM，递归过程是不能中断的。如果组件树的层级很深，递归会占用线程很多时间，造成卡顿。React16 将递归的无法中断的更新重构为异步的可中断更新，推出了新的 Fiber 架构。原本的 ReactElement 只有 children，在中断恢复时，无法找到其兄弟节点和父节点，无法从断点处继续完成渲染工作。
2024-04-04 12:17:33
929
原创 Python中的__init__和__new__
__init__方法是一个初始化方法，用于在创建对象后初始化该对象的属性，而__new__方法用于创建对象。当我们在类中定义__new__和__init__方法时，Python 首先调用__new__方法来创建对象，然后调用__init__方法来初始化对象的属性。
2024-03-31 15:48:48
321
原创 Vue3之defineModel
defineModel是一个宏，所以不需要从vue中import导入，直接使用就可以了。这个宏可以用来声明一个双向绑定 prop，通过父组件的v-model来使用
2024-03-31 15:37:27
2528
1
原创 React高阶组件(HOC)
高阶组件不是组件，它是一个将某个组件转换成另一个组件的纯函数。高阶组件的主要作用是实现代码复用和逻辑抽象、对state和props进行抽象和操作、对组件进行细化（如添加生命周期）、实现渲染劫持等。在实际的业务场景中合理的使用高阶组件，可以提高开发效率和提升代码的可维护性。高阶组件的实用性使其频繁地被大量React.js相关的第三方库，如的connect方法、等所使用，了解高阶组件对我们理解各种React.js第三方库的原理很有帮助。高阶组件有两种实现方式，分别是属性代理和反向继承。
2024-03-24 23:41:34
1008
原创 前端并发控制
我们探讨了使用Promise，callback和RxJS的方式实现并发限制，每种方式中又介绍了三种代码思路，包括全部并发、分批并发以及限制并发。「全部并发」适用于需要将请求分批次处理的场景，简单易懂，但可能不是最高效的方法。「分批并发」在保持一定并发度的同时，避免同时发出过多的请求，适用于需要控制资源消耗的场景。「限制并发」则结合了并发的高效性和结果顺序的一致性，适用于对结果顺序有要求的并发请求处理。通过选择合适的方法，我们可以在保证性能的同时，满足不同场景下对并发控制的需求。
2024-03-24 23:30:48
1666
原创 HTML5 Web Worker之性能优化
Web Workers 是现代 Web 开发的一个基本特性，它允许开发人员将 CPU 密集型任务放到单独的线程中执行，从而提高应用的性能和响应能力。然而，在处理 Web Workers 时需要记住一些重要的限制和注意事项，例如无法访问 DOM 和数据类型之间传递的限制等。为了避免这些潜在问题，可以采用上面提到的策略，如使用异步方法并注意卸载的任务的复杂性。在未来，使用 Web Workers 进行多线程似乎仍然是提高 Web 应用程序性能和响应能力的重要技术。
2024-03-10 12:54:32
1314
原创 Mongodb基础(node.js版)
Mongodb是一个文档数据库，以文档形式存储数据，格式类似于JSON// 对应 students 集合// 用 Schema 定义数据规范name: {},}, {timestamps: true // 时间戳， 在插入、更新数据后将会加上相应的时间数据// 在每一条文档中加入 createdAt 和 updatedAt})// Model 对于 Collection本文只是把mongodb和node.js连接mongodb等基础操作进行了整理，能用在常用的一些场景中。
2024-03-03 00:07:46
914
原创 node.js实现结合 RSA 和 AES 加密算法的消息交换加密传输&深入理解 node 中的 crypto 加密模块
本文主要介绍了结合使用对称加密算法(AES)和非对称加密算法(RSA)对消息交换双方消息加密传输的典型方案以及从简单的 hash 算法，到对称加密，最后到非对称加密和签名，都有个大致的了解。后续我们也会对 node 的其他模块进行深入的理解。文章中使用 nodejs 代码演示了主要流程的实现方式。在基于的浏览器/服务器(B/S)的服务中，浏览器端没有nodejs接口能力，可借助第三方库crypto-jsjsencrypt等提供的 API 实现相关加密和解密算法。
2024-03-02 23:42:59
1213
原创 JS的高级用法
在本文中，我们介绍了一些JavaScript的高级知识点，如高级数据结构和算法、函数式编程、异步编程和面向对象编程。我们还提供了一些代码示例和实战案例，让掘友们更好地理解和掌握这些技术。
2024-02-17 15:44:11
1011
原创 分享几个JS 工具函数
return +year + "年" + (month + 1) + "月" + date + "日 " + hour + ":" + miu + ":" + sec;Day.js 是一个仅 2kb 大小的轻量级 JavaScript 时间日期处理库，下载、解析和执行的JavaScript更少，为代码留下更多的时间。// 判断数据是基本数据类型的情况和函数的情况。//正则对象直接返回一个新的正则对象。// 日期对象直接返回一个新的日期对象。// 获取对象所有自身属性的描述。// 判断数据是引用类型的情况。
2024-02-17 15:36:47
936
原创 前端常见的设计模式
js复制代码// 需求：新员工入职，按照规定流程，进行相关培训和办理好员工相关资料init() {// 初始化员工信息// 创建员工名片// 入职培训// 训后测试。
2024-02-16 14:00:19
1733
原创 Vue3 中应该使用 Ref 还是 Reactive？
你可能会好奇：为什么我们需要使用带有.value的 ref，而不是普通的变量？为了解释这一点，我们需要简单地讨论一下 Vue 的响应式系统是如何工作的。当你在模板中使用了一个 ref，然后改变了这个 ref 的值时，Vue 会自动检测到这个变化，并且相应地更新 DOM。这是通过一个基于依赖追踪的响应式系统实现的。当一个组件首次渲染时，Vue 会在渲染过程中使用的每一个 ref。然后，当一个 ref 被修改时，它会追踪它的组件的一次重新渲染。
2024-02-16 13:41:09
1580
1
原创 GoJS可视化JavaScript库讲解
GoJS是一个可视化JavaScript库，用于浏览器中创建交互图形，（比如流程图，树图，关系图，力导图等等）。允许您为用户构建各种图表，从简单的流程图、组织图到图表、SCADA和BPMN图表、医学图表（如基因组图）等等。GoJS使用可定制的模板和布局，可以轻松构建复杂节点、链接和组的JavaScript图。为用户提供了许多高级功能，如拖放、复制粘贴、就地文本编辑、工具提示、上下文菜单、自动布局和操作。GoJS不依赖于任何JS库或框架，可与任何HTML或JS框架配合工作，甚至可以不用框架。
2024-02-15 00:09:46
1987
1
原创 tween.js（补间动画）的介绍和使用方法
tween.js是一款简单易用的JavaScript补间动画库，它可以让Web开发者很方便地创建和控制复杂的动画效果。它的特点是功能全面、易于使用，支持各种类型的动画插值器和缓动函数，以及灵活的回调函数和参数调整。此外，它还支持并行和序列动画，实现动画效果的细粒度控制。
2024-02-14 23:02:50
1841
1
原创 Three.js城市展示，可视化大屏
1、d3.js通过投影把地图数据的json映射到3维空间中，城市地图的json下载我就不多讲了，网上有很多教程，换成自己所需的城市就行；2、地图上展示的数据展示的label，一开始用的sprite小精灵模型做的，但是会失真不清楚，后来换成了CSS2DRenderer这种方式，就相当于把html渲染到3维空间里，屡试不爽；3、为了达到“酷炫智能”效果，在一加载和点击区县的时候，做了camera的动画（镜头移动、拉近），在这里就要在vue中引入tween.js了，tween做补间动画，还是很好用的；
2024-02-14 22:52:53
2099
5
原创 vue2 新闻消息向上无缝滚动
这是很久以前项目中用到的功能，目前要达到的效果是新闻逐条向上滚动，没有使用第三方插件，vue2版本的，vue3可以自行改造，适合新闻列表模块。后续也会出其他功能块，每个功能块都很简洁，复制粘贴就能用到项目中，节约时间。
2024-02-14 15:35:54
806
3
原创 JS 中的数据代理
所谓数据代理（也叫数据劫持），指的是在访问或者修改对象的某个属性时，通过一段代码拦截这个行为，进行额外的操作或者修改返回结果。比较典型的是和 ES2015 中新增的Proxy对象。另外还有已经被废弃的，废弃的原因正是Proxy的出现，因此这里我们就不继续讨论这个已经被浏览器删除的方法了。数据劫持最著名的应用当属双向绑定，这也是一个已经被讨论烂了的面试必考题。例如 Vue 2.x 使用的是(Vue 在 3.x 版本之后改用Proxy进行实现)。
2024-02-13 15:10:14
1341
原创 JS 中的 Proxy(代理)和 Reflect(反射)
使用代理的主要目的是可以定义捕获器（trap）。捕获器就是在处理程序对象中定义的“基本操作的拦截器”。每个处理程序对象可以包含零个或多个捕获器，每个捕获器都对应一种基本操作，可以直接或间接在代理对象上调用。每次在代理对象上调用这些基本操作时，代理可以在这些操作传播到目标对象之前先调用捕获器函数，从而拦截并修改相应的行为。所有捕获器都可以访问相应的参数，基于这些参数可以重建被捕获方法的原始行为。比如，get()捕获器会接收到目标对象要查询的属性和代理对象三个参数。
2024-02-13 14:56:23
1097
原创 js之Reflect 反射
Reflect是一个内置的对象，它提供了拦截JavaScript操作的方法。它不是一个函数对象，因此不可构造。Reflect对象提供了一些静态方法来操作对象，例如等。这些方法可以用于读取、修改或删除对象的属性，并返回相应的结果。在Vue 3中，Reflect也被用作一个修饰符（decorator），用于监听DOM元素上的属性变化并将其反映到Vue实例的数据上。当DOM元素的属性发生变化时，Vue会捕获这些变化，并更新相应的数据，从而保持数据和视图的同步。
2024-02-13 14:44:11
2468
原创 vue3的双向数据绑定原理和响应式原理以及和vue2响应式的区别
Proxy总的来说，Vue3的双向数据绑定就是通过响应式系统和虚拟DOM的结合来实现的。响应式系统保证了数据和视图的同步，而虚拟DOM则通过高效的更新方式提高了渲染性能。
2024-02-13 14:28:36
1825
原创 推荐几个基于Vue3.0全家桶的优秀开源项目
PPTist 是一个基于 Vue3.x + TypeScript + Pinia + Ant Design Vue + Canvas 的在线演示文稿（幻灯片）应用，还原了大部分 Office PowerPoint 常用功能，实现在线PPT的编辑、演示，支持导出PPT文件。vue-next-admin 是一个基于 Vue3.x + Typescript + Vite + Element plus + Vuex 等，适配手机、平板、PC 的后台开源免费模板库。
2024-02-13 14:20:00
2166
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人