<?xml version="1.0" encoding="utf-8" ?><rss version="2.0"><channel><title><![CDATA[科技改变世界，技术驱动未来。]]></title><description><![CDATA[科技改变世界，技术驱动未来。]]></description><link>https://blog.csdn.net/orbit4</link><language>zh-cn</language><generator>https://blog.csdn.net/</generator><copyright><![CDATA[Copyright &copy; orbit4]]></copyright><item><title><![CDATA[用Python+AI做了一个拼豆工具（附对比图）]]></title><link>https://blog.csdn.net/orbit4/article/details/156020227</link><guid>https://blog.csdn.net/orbit4/article/details/156020227</guid><author>orbit4</author><pubDate>Wed, 17 Dec 2025 16:37:45 +0800</pubDate><description><![CDATA[摘要：本文介绍了一款自研拼豆图纸工具的开发过程，相比免费工具在色彩还原度和细节处理上优势明显。工具提供高清拼豆图导出（含网格/色号）、预览图生成、EXCEL采购清单等功能，支持水印设置、背景色调整等个性化操作。开发者使用Python编程语言结合GoogleAIStudio的Gemini3ProPreview模型，在图形处理和AI辅助开发方面取得良好效果。该工具在色彩算法、智能去噪等核心技术上优于免费方案，目前已开放定制服务。]]></description><category></category></item><item><title><![CDATA[【H5工具】一个简约高级感渐变海报H5设计工具]]></title><link>https://blog.csdn.net/orbit4/article/details/154121129</link><guid>https://blog.csdn.net/orbit4/article/details/154121129</guid><author>orbit4</author><pubDate>Thu, 30 Oct 2025 14:44:52 +0800</pubDate><description><![CDATA[摘要：本文介绍了一个基于HTML5的在线渐变背景设计工具，具备颜色管理（支持2-4种颜色自定义）、渐变角度调节、文本编辑（20字符以内）及导出功能（PNG图片/CSS代码）。工具提供实时预览效果，已完成PC端和移动端适配。作者计划优化图片导出格式，并在平台推广该工具，定价9.99米永久使用，作为被动收入来源之一。该工具是继配色网站后开发的第二款完整产品。]]></description><category></category></item><item><title><![CDATA[【2025年10月】有感、随笔]]></title><link>https://blog.csdn.net/orbit4/article/details/153969750</link><guid>https://blog.csdn.net/orbit4/article/details/153969750</guid><author>orbit4</author><pubDate>Mon, 27 Oct 2025 16:30:19 +0800</pubDate><description><![CDATA[之前工作期间有时间的时候，我是有在多个平台输出内容（主要是csdn、小红书、公众号），后面慢慢地将“技术分享”的重点转移到“个人学习和商业化”，在小红薯上是发布自己开发的产品（小程序）和尝试‘商业化变现’；一直更新到最新一篇文章（9.29）。]]></description><category></category></item><item><title><![CDATA[深入理解 SSE：服务器发送事件及其在前后端中的实践]]></title><link>https://blog.csdn.net/orbit4/article/details/152273424</link><guid>https://blog.csdn.net/orbit4/article/details/152273424</guid><author>orbit4</author><pubDate>Mon, 29 Sep 2025 16:52:15 +0800</pubDate><description><![CDATA[本文介绍了SSE（Server-Sent Events）技术在前端实时数据获取中的应用。SSE基于HTTP协议，允许服务器单向推送数据到客户端，相比轮询更高效，比WebSocket更轻量。文章对比了SSE与WebSocket的差异，详细展示了如何在Express后端设置SSE服务（包括响应头配置、连接维护和数据格式），以及如何在Vue2前端通过EventSource API建立连接、处理消息。最后提供了一个包含打字机动画效果的实现案例，演示了SSE在实时数据展示中的实际应用场景。]]></description><category></category></item><item><title><![CDATA[实现美团购物车小球动画效果：从原理到代码]]></title><link>https://blog.csdn.net/orbit4/article/details/152004218</link><guid>https://blog.csdn.net/orbit4/article/details/152004218</guid><author>orbit4</author><pubDate>Wed, 24 Sep 2025 10:20:22 +0800</pubDate><description><![CDATA[本文介绍了如何实现类似美团的购物车抛物线动画效果，通过HTML、CSS和JavaScript技术组合完成。关键实现包括：1.响应式商品网格布局；2.点击生成彩色小球；3.计算贝塞尔曲线控制点实现抛物线运动轨迹；4.使用Web Animations API执行动画；5.购物车图标接收反馈效果。该方案采用纯前端技术实现，适配移动端和PC端，包含重置功能，完整代码可直接使用。这种动画效果能显著提升电商应用的用户体验，展现了前端动画技术的实用价值。]]></description><category></category></item><item><title><![CDATA[用【PinMe】轻松实现前端部署（文章附有演示案例）]]></title><link>https://blog.csdn.net/orbit4/article/details/151968908</link><guid>https://blog.csdn.net/orbit4/article/details/151968908</guid><author>orbit4</author><pubDate>Mon, 22 Sep 2025 19:11:12 +0800</pubDate><description><![CDATA[摘要：PinMe是一款基于区块链和IPFS的去中心化前端部署工具，支持用户通过命令行或可视化界面轻松部署静态网站。与传统中心化部署工具相比，PinMe具有抗审查、数据持久性和隐私保护等优势，适合Web3应用开发。其操作简单，只需上传文件即可生成可访问的区块链域名链接，但访问速度可能受限于去中心化网络。传统部署工具则在性能稳定性和扩展性上更具优势。PinMe展现了Web3技术在前端部署领域的创新应用。]]></description><category></category></item><item><title><![CDATA[Nano Banana制作3D立体打印效果图]]></title><link>https://blog.csdn.net/orbit4/article/details/151705647</link><guid>https://blog.csdn.net/orbit4/article/details/151705647</guid><author>orbit4</author><pubDate>Mon, 15 Sep 2025 09:50:55 +0800</pubDate><description><![CDATA[Nano Banana 是 Google 于 2024 年推出的革命性 AI 驱动图像生成与编辑模型，正式名称为 Gemini 2.5 Flash Image。技术背景：Nano Banana 基于 Google DeepMind 最新的 Gemini 2.5 Flash Image 架构，采用原生多模态设计理念，将文本理解、图像生成、编辑处理等功能统一在一个模型中。]]></description><category></category></item><item><title><![CDATA[一文搞懂跨域：从原理到解决方案]]></title><link>https://blog.csdn.net/orbit4/article/details/151562263</link><guid>https://blog.csdn.net/orbit4/article/details/151562263</guid><author>orbit4</author><pubDate>Thu, 11 Sep 2025 14:00:00 +0800</pubDate><description><![CDATA[本文介绍了前端开发中常见的跨域问题及其解决方案。跨域指浏览器出于安全考虑限制不同域名、协议或端口间的资源请求。主要解决方案包括： CORS（跨域资源共享）：现代浏览器标准方案，通过服务器设置响应头实现跨域访问，支持多种请求类型； JSONP：利用script标签特性实现跨域，仅支持GET请求，安全性较差； 代理服务器：开发环境常用方案，通过中间服务器转发请求规避跨域限制。生产环境推荐使用CORS，JSONP适合兼容旧浏览器，代理则主要用于开发调试。]]></description><category></category></item><item><title><![CDATA[深入解析：ES6 中 class 与普通构造器的区别]]></title><link>https://blog.csdn.net/orbit4/article/details/151402323</link><guid>https://blog.csdn.net/orbit4/article/details/151402323</guid><author>orbit4</author><pubDate>Wed, 10 Sep 2025 14:17:24 +0800</pubDate><description><![CDATA[本文深入对比了JavaScript中ES6 class与ES5构造函数的区别。表面看class是构造函数的语法糖，但本质存在四大差异：1) class必须通过new调用，构造函数可随意调用；2) class原型方法默认不可枚举；3) class默认启用严格模式；4) class方法不能作为构造函数使用。通过Babel转译揭示了class的内部实现机制，并解答了将class转换为等构造函数的面试题。结论指出，虽然两者功能相似，但class提供了更严格的语法限制和更清晰的代码结构，推荐在现代开发中使用。]]></description><category></category></item><item><title><![CDATA[如何优雅解析和展示结构化文本内容]]></title><link>https://blog.csdn.net/orbit4/article/details/151072965</link><guid>https://blog.csdn.net/orbit4/article/details/151072965</guid><author>orbit4</author><pubDate>Mon, 01 Sep 2025 15:56:36 +0800</pubDate><description><![CDATA[本文介绍了如何优雅处理后端返回的带样式结构化文本数据。传统字符串处理方式会丢失样式信息，而正确做法是先解析JSON数据，再逐段处理。文章提供了完整的前端实现方案，核心是解析JSON后遍历每个文本片段，动态创建span元素并应用对应CSS样式。关键点包括：JSON数据解析、CSS属性驼峰式转换、使用textContent保留换行效果。这种处理方式能准确还原后端数据中的所有样式和格式，适用于各类结构化文本展示场景。]]></description><category></category></item><item><title><![CDATA[前端文件下载的三种方式：URL、二进制与 Base64 的深度解析]]></title><link>https://blog.csdn.net/orbit4/article/details/150919376</link><guid>https://blog.csdn.net/orbit4/article/details/150919376</guid><author>orbit4</author><pubDate>Wed, 27 Aug 2025 10:41:35 +0800</pubDate><description><![CDATA[本文探讨了Web应用中三种主流文件下载方式：URL直接下载、二进制数据下载和Base64编码下载。URL下载通过创建链接标签实现，适合大文件；二进制下载需要前端转换Blob对象，适用于动态生成文件；Base64编码适合小型文件，但会增加体积。三种方式在数据体积、内存占用、适用文件大小等方面各有特点。文章还提供了通用的前端处理方案，可根据不同返回数据类型自动选择合适的下载方式。选择时应考虑后端接口设计、文件大小和权限控制等因素。]]></description><category></category></item><item><title><![CDATA[【Express】常用中间件用法：会话管理、输入验证（文章附有完整代码示范）]]></title><link>https://blog.csdn.net/orbit4/article/details/145777364</link><guid>https://blog.csdn.net/orbit4/article/details/145777364</guid><author>orbit4</author><pubDate>Fri, 22 Aug 2025 10:00:00 +0800</pubDate><description><![CDATA[Express 是一个简洁而强大的 Node.js Web 应用框架，它提供了丰富的中间件来帮助开发者快速构建 Web 应用。前面我写的express专栏中很少涉及express中间件的用法，因此现在补充一些常用的中间件。并展示如何将它们有效地结合起来，以构建一个功能更强大、更安全的 Express 应用。]]></description><category></category></item><item><title><![CDATA[Express 后端三层模型：让你的 API 架构更优雅]]></title><link>https://blog.csdn.net/orbit4/article/details/150578534</link><guid>https://blog.csdn.net/orbit4/article/details/150578534</guid><author>orbit4</author><pubDate>Thu, 21 Aug 2025 14:11:44 +0800</pubDate><description><![CDATA[Express后端开发中的三层模型（Routes、Services、DAO）是实现模块化开发的核心架构。路由层负责接收请求和返回响应，服务层处理业务逻辑，DAO层专注数据操作。这种分层设计使各层职责明确，降低了代码耦合度，提高了复用性和可维护性。通过清晰的协作流程（请求→路由→服务→DAO→响应），实现了高效的数据流转，符合单一职责原则，便于测试和扩展。实践表明，这种架构能有效解决代码混乱和维护困难的问题。]]></description><category></category></item><item><title><![CDATA[express+Vue2进行项目实战-景点后台管理系统（中篇）]]></title><link>https://blog.csdn.net/orbit4/article/details/150484275</link><guid>https://blog.csdn.net/orbit4/article/details/150484275</guid><author>orbit4</author><pubDate>Tue, 19 Aug 2025 09:59:52 +0800</pubDate><description><![CDATA[本文介绍了Express+Vue2景点后台管理系统的前端开发过程，重点讲解了页面功能的实现。主要包括：1. 使用vue-admin-template模板实现的登录页和首页；2. 通过配置路由实现景点管理菜单层次结构；3. 详细开发了景点管理页面的三大部分：搜索模块（支持字段选择和内容输入）、列表展示模块（包含图片预览和多列信息展示）、弹窗模块（统一处理添加和编辑功能）。文章提供了完整的代码示例，并强调虽然暂未连接后端数据，但已构建好前端框架逻辑，为后续数据对接打好基础。]]></description><category></category></item><item><title><![CDATA[【实用案例】录音分片上传的核心逻辑和实现案例【文章附有代码】]]></title><link>https://blog.csdn.net/orbit4/article/details/150218822</link><guid>https://blog.csdn.net/orbit4/article/details/150218822</guid><author>orbit4</author><pubDate>Mon, 11 Aug 2025 16:55:52 +0800</pubDate><description><![CDATA[本文介绍了一种基于分片上传技术的录音文件上传解决方案。前端通过MediaRecorder API实现录音功能，将大文件分割成5MB的分片，采用MD5校验和断点续传机制确保上传可靠性。后端使用Express框架接收分片并合并成完整文件。该方案解决了大文件上传限制问题，支持暂停/继续功能，并具备扩展性，可应用于视频、文档等多种大文件上传场景。]]></description><category></category></item><item><title><![CDATA[通俗易懂的浏览器事件循环指南]]></title><link>https://blog.csdn.net/orbit4/article/details/145764783</link><guid>https://blog.csdn.net/orbit4/article/details/145764783</guid><author>orbit4</author><pubDate>Thu, 07 Aug 2025 10:30:00 +0800</pubDate><description><![CDATA[JavaScript是单线程的，这意味着它一次只能执行一个任务。为了处理异步操作（比如定时器、网络请求等），浏览器引入了事件循环机制。不断地从任务队列中取出任务并执行。事件循环的工作流程可以简单概括为以下几个步骤：执行同步代码。执行微任务队列中的所有任务。执行一个宏任务。重复上述过程。]]></description><category></category></item><item><title><![CDATA[【Vant Weapp】下拉菜单+自定义卡片的封装+跳转详情页【演示+代码】 ]]></title><link>https://blog.csdn.net/orbit4/article/details/149860398</link><guid>https://blog.csdn.net/orbit4/article/details/149860398</guid><author>orbit4</author><pubDate>Mon, 04 Aug 2025 09:39:08 +0800</pubDate><description><![CDATA[本文介绍了如何在小程序中使用vant weapp组件库的下拉菜单(DropdownMenu)与卡片列表结合的开发实践。文章首先详细说明了开发环境准备，包括Vant组件库的安装和配置步骤，然后提供了自定义卡片组件的实现方案，包括组件下载引入、页面示范和数据结构设计。文中还展示了如何通过下拉菜单实现商品分类筛选功能，并补充了点击卡片跳转详情页的案例实现，包括轮播图展示和商品详情布局。最后给出了完整的代码仓库地址供开发者参考使用。该方案解决了官方示例中下拉菜单未与卡片列表结合的问题，为小程序开发提供了实用参考。]]></description><category></category></item><item><title><![CDATA[【Uni-app开发笔记】录音和会话列表的双向联动【效果展示+代码获取】]]></title><link>https://blog.csdn.net/orbit4/article/details/149809358</link><guid>https://blog.csdn.net/orbit4/article/details/149809358</guid><author>orbit4</author><pubDate>Thu, 31 Jul 2025 17:32:50 +0800</pubDate><description><![CDATA[本文介绍了前端开发中实现音频与文本双向联动的技术方案。核心思路是通过建立音频时间与文本片段的映射关系，实现播放时自动高亮对应文本，点击文本跳转到对应音频位置的功能。文章详细解析了数据结构设计、音频驱动文本、文本驱动音频的实现逻辑，以及状态管理和异常处理等关键技术点。作者以uni-app为例，展示了如何通过AI辅助完成95%的代码实现，强调理解核心逻辑比掌握具体技术更重要。该方案适用于录音转写、会议记录等需要音文同步的场景，具有较高的实用价值。]]></description><category></category></item><item><title><![CDATA[【Vue学习笔记】状态管理：Pinia 与 Vuex 的使用方法与对比【附有完整案例】]]></title><link>https://blog.csdn.net/orbit4/article/details/149609930</link><guid>https://blog.csdn.net/orbit4/article/details/149609930</guid><author>orbit4</author><pubDate>Thu, 24 Jul 2025 17:25:42 +0800</pubDate><description><![CDATA[本文分享了Vue项目中状态管理的实践经验，重点对比了Vuex和Pinia两种方案。文章首先介绍了状态管理的适用场景，然后详细讲解了Vuex4.x的核心概念和使用方法，包括State、Mutations、Actions、Getters的配置和在组件中的调用方式。接着介绍了Pinia的安装配置、核心概念以及组件使用方法，并提供了完整的代码示例。最后从模块化、TypeScript支持、代码简洁性等维度对两者进行对比，建议新项目优先选择Pinia，而现有Vuex项目可根据实际情况决定是否迁移。]]></description><category></category></item><item><title><![CDATA[【Echarts】“折线+柱状”实现双图表-家庭用电量可视化【文章附完整代码】]]></title><link>https://blog.csdn.net/orbit4/article/details/149170008</link><guid>https://blog.csdn.net/orbit4/article/details/149170008</guid><author>orbit4</author><pubDate>Mon, 07 Jul 2025 14:26:40 +0800</pubDate><description><![CDATA[本文介绍了使用ECharts实现家庭用电量可视化监控的实战案例。通过Vue3+ECharts组合，实现了双图表联动展示（折线图显示实时功率波动，柱状图展示平均用电趋势），并采用智能颜色映射技术（根据用电负荷自动切换蓝/绿/橙/红等颜色）。案例模拟了真实家庭用电场景，按时间段生成特征数据（凌晨低功率、傍晚高负荷），并设置5秒自动更新机制。文章详细讲解了核心功能实现步骤，包括图表架构搭建、动态数据生成、颜色映射配置等，最后提供了源代码获取方式。该案例适合前端新手快速入门数据可视化开发。]]></description><category></category></item></channel></rss>