前端架构

guslegend28 分钟前
低代码·需求分析·架构设计·ssr·前端架构
需求分析和架构设计:做什么,如何做简介:架构从业务出发,先理解需求,再做设计,最后才是开发核心观点分析需求的三种思维设计三原则普通程序员 vs 架构师
Frag0ut12 天前
html5·前端开发·前端架构·大前端·webcomponents·技术趋势·浏览器api
【深度思考】前端基石的觉醒:探讨 HTML 语言的再进化方向在前端开发者的日常中,HTML 似乎已经沦为了 JSX 或 Vue 模板中的“配角”。我们习惯了用 JavaScript 去驱动视图,用虚拟 DOM 去diff差异,用庞大的状态管理库去维护数据。
DsirNg12 天前
css·flexbox·grid·前端架构·响应式布局·设计系统·container queries
响应式的真正输入:为组件重新定义可用空间一个商品卡放在主内容区时是横向图文结构;放进侧栏后,文字挤压、操作按钮换行;放进弹窗的双栏区域后,它又可能因为页面视口足够宽而继续套用“大屏样式”。
FungLeo20 天前
react·前端架构·分页查询·react router·成为全栈·url状态
成为全栈·React 管理后台篇·列表页范式:让分页、筛选和返回位置进入 URL页码、筛选和排序不是表格组件的临时状态,而是“用户正在查看哪一组数据”的完整描述。只要这个描述值得刷新、返回或分享,就应该进入 URL。
DsirNg2 个月前
react·next.js·app router·前端架构·组件设计·react server components·server actions
先守住数据,再下沉交互:RSC 组件分层的实战决策法在真实项目里,React Server Components(RSC)最容易被问成一句话:“这个组件该不该加 use client?”
DsirNg2 个月前
性能优化·react·next.js·app router·前端架构·rsc·react server components
React Server Components 在真实项目中的边界:哪些组件该放在服务端React Server Components(RSC)最容易引发两种极端做法:要么把整个页面写成 Client Component,沿用传统 React 的习惯;要么误以为“服务端组件更快”,于是试图把所有逻辑都塞进服务端。
赵大仁2 个月前
前端·ai·react·next.js·前端架构·生成式ui
生成式 UI 实战:用 JSON Schema + React 动态渲染 AI 界面《AI 前端实战》第 5/8 篇 上篇:Tool Calling 前端接入 下篇预告:Agent 前端状态机
布兰妮甜2 个月前
nginx·跨域·cors·前端架构·浏览器安全
跨域全方案对比:CORS、Nginx 反向代理、JSONP、iframe、postMessageHi,我是前端人类学! 跨域是浏览器同源策略导致的拦截行为——协议、域名、端口任一不同,AJAX 请求即被阻断。解决方案没有万能药,需根据场景权衡。本文将对比五种主流方案,并给出选型建议。
gis开发之家3 个月前
前端·javascript·vue.js·前端框架·vue3·前端工程化·前端架构
vue3组合式函数(Composables)的艺术——将业务逻辑从UI组件中连根拔起上一篇文章我们把目录按 DDD 拆得很漂亮,但打开组件一看,<script setup>里还是塞满了接口请求、表单校验、定时器清理……这不就是换了个地方的意大利面吗?
a23121214 个月前
前端架构·技术教程·api集成·java前端·vue实战
Java到Vue:前端开发流程实战指南随着前后端分离架构的普及,Java 开发者越来越多地参与到前端项目中。Vue 作为主流的前端框架,因其易用性和灵活性被广泛应用于企业级开发。本指南将结合 Java 与 Vue 的技术差异,系统解析前端项目结构、后端 API 调用实现,以及常见问题排查与调优,帮助 Java 开发者高效切换到 Vue 前端开发。
梵得儿SHI4 个月前
前端·vue.js·代码规范·eslint·团队协作·前端工程化·前端架构
Vue 项目实战与性能优化:工程化与协作全指南(规范 + 配置 + 协作 + 文档)做 Vue 项目,个人开发靠 “手感”,团队开发靠 “规范”;小项目拼 “功能实现”,大项目拼 “工程化与协作”。
前端技术官4 个月前
ffmpeg·前端架构·移动端性能优化·3d交互·video scrubbing
从 15MB 减到 800KB,一行 ffmpeg 解决3D 渲染卡顿问题在做跨境电商和独立站(如 Shopify)的前端架构时,商品详情页经常会遇到一个非常经典的业务需求:360度商品 3D 交互预览。
周淳APP5 个月前
前端·学习·iframe·微前端·qiankun·前端架构
微前端核心沙箱机制深度解析:从iframe到乾坤沙箱本文旨在串联微前端架构中的核心隔离技术,从最基础的iframe方案讲起,深入到乾坤框架的JS沙箱演进史(快照沙箱、单应用代理沙箱、多应用代理沙箱),CSS隔离以及路由劫持等关键环节,帮助您浅浅梳理体系。
是罐装可乐6 个月前
前端·性能优化·spa·前端架构·请求队列
SPA首屏接口过多导致卡顿?一套前端请求调度方案彻底解决在实际项目中,你一定遇到过:👉 这些问题本质都是:系统缺乏"请求调度能力"我们把问题抽象一下:浏览器会同时发起多个请求,容易:
Light608 个月前
低代码·spark·前端架构·apaas·模型驱动·能力分层·上下文契约
领码 SPARK aPaaS 前端开发体系 技术架构(最终版)摘要 本方案提出一套面向平台型、配置型与复杂业务系统的前端技术架构:能力分层 × 职责解耦 × 上下文契约。体系将前端能力拆分为六层(应用容器、业务编排、业务模型、数据操作、交互能力、基础组件),并以模型优先、操作可配置、上下文契约化为核心,结合 Model Registry、操作 DSL、能力注册器、审计与 CI/CD 流水线,支持低代码、aPaaS 与 AI 驱动场景。文档详细给出接口草案、工程约束、测试策略、迁移路径与风险缓解措施,便于团队在真实项目中快速落地与长期演进。
Marshmallowc9 个月前
前端·react.js·事件循环·微前端·前端架构
React stopPropagation 阻止冒泡失效?深度解析 React 17 事件委派机制变更与微前端冲突解决方案在 React 的演进史中,版本 17 被称为“铺路石”版本。它最显著的变化并非 API 的新增,而是将合成事件(SyntheticEvent)的委派点从 document 挪到了应用的根节点(#root)。
Light6010 个月前
状态模式·前端架构·mcp·react hook·流式渲染·ai交互
【MCP原生时代】第2篇|前端如何舞动 MCP:新一代交互范式——从 Hook 到流式渲染,打造 AI 原生前端体验在 AI 原生时代,前端不再只是静态页面的渲染器,而是 AI 与用户之间的交互舞台。模型上下文协议(MCP)为前端提供了新的交互范式:会话化、工具化、流式化。本文聚焦前端实践,深入解析 MCP 在前端架构中的角色,提供完整的 React Hook 实现、流式渲染策略、用户可控性设计与安全治理方案。通过案例与代码,展示如何让前端真正“舞动” MCP,成为 AI Agent 的最佳舞伴。
路光.1 年前
前端架构·前端提交规范
如何实现pnpm commit拦截首先需要在package.json中下载这几个包执行命令参照http://typicode.github.io/husky/get-started.html
暮冬十七1 年前
前端·前端架构·vue3项目搭建
[特殊字符] Vue3 项目最佳实践:组件命名、目录结构与类型规范指南组件命名不仅影响可读性,也直接决定了后续维护和复用的便捷性。文件名:使用 PascalCase(首字母大写的驼峰命名) 示例:UserProfile.vue、ProductCard.vue
是罐装可乐1 年前
前端·映射·前端架构·代码安全·源码地图·source-map
前端架构知识体系:Source Map 的用法和全面解析在前端开发中,代码通常需要经过 打包、压缩、转译 等处理。 例如,使用 Babel 转译 ES6+ 语法、Webpack 打包模块、Terser 压缩代码。