随笔分类 -  同花顺

前端安全架构：自动鉴权与全局Token注入的深度实践
摘要：前端自动鉴权与全局 Token 注入的深度实践 “安全不是终点，而是每一次请求的起点。” 在现代 Web 应用中，接口安全和统一鉴权已成为前端架构设计的核心环节。尤其在微服务、API 网关盛行的今天，如何让前端自动、无感地完成鉴权，保障每一次数据交互的安全与合规，是每个前端工程师都绕不开的话题。 本 阅读全文
posted @ 2025-06-12 18:02 Justus- 阅读(102) 评论(0) 推荐(0)
前端构建工具解析：Webpack:Rollup:Vite:Gulp的特性对比
摘要：本文档对常见前端打包工具的特征进行对比，并结合实际项目经历进行说明。 1. Webpack 应用场景：用于普通前端项目的打包，适合大型复杂项目。 特征： 支持模块化开发，生态丰富。 插件和Loader机制强大，灵活性高。 支持代码分割、懒加载等高级优化。 性能优化手段多，如Tree Shaking、 阅读全文
posted @ 2025-06-12 17:29 Justus- 阅读(330) 评论(0) 推荐(0)
低成本高收益：用LocalStorage构建接口流量闸门
摘要：通过有效期控制与缓存一致性校验，将非频繁更新接口的调用量降低70% 背景 在前端开发中，接口的调用频率往往随着用户体量的增长而成倍提升。我们某个产品使用了“券商配置”接口（作用：根据不同的客户，返回对应的线上脚本地址，动态加载），最初服务的客户体量较小，接口被频繁调用但未造成明显压力。然而，随着某大 阅读全文
posted @ 2025-06-11 16:21 Justus- 阅读(53) 评论(0) 推荐(0)
前端长链接架构设计：WebSocket数据流实现AI对话页
摘要：背景 最近新增了一个产品项目“今天炒什么”，这是一款面向短线用户的热点选股工具。展示每日精选的热点话题，及相关话题近一个月的热度值。有一个“热点解读”功能，需要调用大模型接口实现一个AI对话页。其中大模型接口为流式响应，所以决定采用 WebSocket 技术实现前后端实时通信，确保为用户提供流畅自然 阅读全文
posted @ 2025-06-11 15:28 Justus- 阅读(506) 评论(0) 推荐(0)
教你从0开始搭建一个NodeJs前端脚手架
摘要：“深入浅出Node.js前端脚手架：解析commander.js + inquirer.js + fs的核心组合” 在现代前端工程化体系中，脚手架工具已成为提升开发效率、规范团队协作的利器。本文将以实际项目为例，深入解析如何用 Node.js 结合 commander.js、inquirer.js 阅读全文
posted @ 2025-06-10 08:09 Justus- 阅读(149) 评论(0) 推荐(0)
高频接口前端缓存解决方案：Service Worker + IndexedDB
摘要：背景 在2024年国庆前后，股市行情出现了一波高潮，国庆期间利好消息影响散户情绪造成拥堵开户的场景。对网络和后端造成巨大的压力，同时也影响用户体验，这种突发情况一般是网络组会采用扩容的方式进行应对，但由于内部硬件资源不充裕、资源调配不均匀，所以需要前端同事一起进行优化。 我这边最终组织团队决定使用S 阅读全文
posted @ 2025-06-07 10:46 Justus- 阅读(185) 评论(0) 推荐(0)
SSO单点登录原理解析：前端工程师必须知道的认证逻辑
摘要：在多系统协作的企业级应用中，单点登录（SSO, Single Sign-On）是提升用户体验和安全性的关键技术。本文结合实际前端实现代码和 SSO 认证中心的原理，详细解析如何在前端项目实现单点登录。 一、业务背景与需求 随着团队业务系统和业务组的划分逐渐增多，用户频繁切换系统时需要重复登录，既影响 阅读全文
posted @ 2025-06-07 10:33 Justus- 阅读(416) 评论(0) 推荐(0)
前端BEM规范：说服团队统一css代码风格
摘要：背景 在我负责建设移动端组件库的前期，发现团队对 JS/TS 代码规范的重视，往往远超 CSS/SCSS。但在当前这种UI体系的“样式驱动”项目中，CSS 规范的缺失会带来极大的维护成本和协作障碍。BEM（Block-Element-Modifier）规范，是解决这一痛点的最佳实践之一。 为什么 J 阅读全文
posted @ 2025-06-07 10:18 Justus- 阅读(65) 评论(0) 推荐(0)
一行代码切换暗黑模式：CSS变量与全局状态管理怎样结合
摘要：预设配色要求 两套主题风格为白版跟黑版，默认主题为白版； 变量 白版 黑板 主色 #E8302E #E9533E 警告色 #ED7F31 #ED7F31 字体色 #333333 #202022 背景色 #FFFFFF #252528 线条色 #252528 #D2D2D2 实现方案 1.scss混入 阅读全文
posted @ 2025-05-18 12:22 Justus- 阅读(61) 评论(0) 推荐(0)
template不行？使用render函数开发动态组件
摘要：背景 今天在开发某个需求的时候遇到了一个问题，某个组件的一些html标签需要根据props定义的tag字段自定义传入，生成对应的div、p、span等标签显示在页面中，并且tag不固定（排除了枚举所有标签并使用v-if控制实现的可能）。但是vue2.x的模板语法只支持在template中添加某些确定 阅读全文
posted @ 2025-05-18 12:22 Justus- 阅读(53) 评论(0) 推荐(0)