- 博客(1329)
- 收藏
- 关注
转载 Cursor 内部工作原理
Cursor 会将你的问题转为一个向量,然后在向量数据库中查找最相近的片段,可能包括多个文件中的函数调用、定义、注释等。即便你配置了自己的 OpenAI API 密钥,请求仍会先经过 Cursor 的后端,这样系统才能添加系统指令、代码上下文以及专属格式,确保模型理解你的需求。介绍了 Cursor,一个结合了 AI 技术的代码编辑器,它通过深度学习和语义索引的方式,提升了开发者的工作效率。Cursor 通过与 VS Code 相似的界面和功能,以及自己的 AI 特性,实现了代码的智能化编辑和错误检查。
2025-06-11 11:42:13
13
转载 MCP:AI界的“Type-C”——让AI模型和世界对话从此“零代沟”!
谷歌、OpenAI、阿里、百度等科技巨头已将MCP纳入技术战略,通过它提升AI服务的兼容性、扩展性与智能化水平,开发者可依托其开放生态快速构建插件化应用,企业亦能借此降低AI集成成本,加速业务创新。,为你提供详细的旅行规划,包括天气预报、行程安排等;作为云上托管 MCP 服务的最佳运行时,函数计算 FC 为阿里云百炼 MCP 提供弹性调用能力,用户只需提交 npx 命令即可“零代码”将开源 MCP Server 部署到云上,函数计算FC 会准备好计算资源,并以弹性、可靠的方式运行 MCP 服务。
2025-06-06 18:49:02
18
1
转载 干了一年半的Vue3项目,总结出了16个代码规范
合理的使用响应性变量。数据量很大的对象或者数组,同时属性又是嵌套的对象,你的业务场景只需要第一层属性具有响应性,推荐使用shallowRef和shallowReactive定义响应性变量,这时不在推荐使用ref和reactive了。在项目或者开发过程中,尽量使用let或者const定义变量,可以有效的规避变量提升的问题,不在赘述,注意const一般用于声明常量或者值不允许改变的变量。另一个常见的问题是:console打印和debugger之类的,虽然说可以通过插件配置在打包的时候删除掉,但是官方提倡的是。
2025-06-03 14:52:24
60
转载 一份完整的「高级前端性能优化」手册
浏览器在解析 HTML 的时候,如果遇到一个没有任何属性的 script 标签,就会暂停解析,先发送网络请求获取该 JS 脚本的代码内容,然后让 JS 引擎执行该代码,当代码执行完毕后恢复执行后续解析。因此,我们可以将每个页面路由组件,拆成单独的一个个 chunk 文件,这样 main.js 文件体积降低,在首屏加载时,不会再加载其他页面的资源,从而提升首屏渲染速度。例举一个常见的场景:在 CSR 客户端渲染中,如果 main.js 资源体积过大,会导致在资源加载完成以前,页面会出现长时间的白屏。
2025-05-29 16:59:12
41
转载 一文搞懂 Cursor 内部工作原理~
Cursor 会将你的问题转为一个向量,然后在向量数据库中查找最相近的片段,可能包括多个文件中的函数调用、定义、注释等。即便你配置了自己的 OpenAI API 密钥,请求仍会先经过 Cursor 的后端,这样系统才能添加系统指令、代码上下文以及专属格式,确保模型理解你的需求。介绍了 Cursor,一个结合了 AI 技术的代码编辑器,它通过深度学习和语义索引的方式,提升了开发者的工作效率。Cursor 通过与 VS Code 相似的界面和功能,以及自己的 AI 特性,实现了代码的智能化编辑和错误检查。
2025-05-21 18:08:32
472
转载 Nextjs首屏加载速度性能从80分优化到98分
css使用的tailwind.css库内部对css做了处理优化, 进行不使用style些内嵌样式,提高编译速度( 首屏不需要的组件可使用lazy-load包来做懒加载处理 加快渲染速度 )google控制台的performance来录制首屏加载过程的文件时长以及阻塞情况,避免一些首次加载无须展示的组件的优化。在根文件加载脚本时 如果当前时外部页面则不需要此wasm不加载它 避免没必要的加载 来优化首次加载速度。可以使用nextui提供的Image,它提供对图片进行不同屏幕的适配尺寸,以及懒加载功能。
2025-05-15 15:18:52
30
转载 错怪 React 的半年-聊聊 KeepAlive
发现问题后,我去问日常开发Vue的童鞋们,因为我两年没写vue了,我说:你们是怎么实现tabs布局的,Vue的Keepalive是怎么实现只有显示哪个页面,别的组件存储而不运行watch的,然后说了一下我在react开发tabs的时候尴尬。注释掉的是正确的,这里不提一嘴,vue的console.log的体验感很ok,下面列的就是正确的,我还去百度了为啥Keepalive无效,直到截这张图写这文的时候才看到,人家都谢了,哈哈哈哈。
2025-05-06 18:55:44
29
转载 微前端的实践总结
同时,需要注意不同框架可能存在的全局变量污染,比如Vue的全局组件、React的全局状态等,这时候需要沙箱隔离机制。可能需要使用externals配置,将公共库从子应用中排除,由主应用统一提供,但不同版本的库可能会有问题。主应用需要处理一级路由,子应用处理自己的子路由。最后考虑到现有的项目可能已有一定的配置,qiankun可能更容易上手,而Module Federation需要webpack5支持,可能需要升级构建工具,这一系列更繁杂。构建和部署方面,子应用需要独立部署,主应用只需加载子应用的入口文件。
2025-04-30 14:24:44
213
转载 前端面试题:浏览器两个 tab 都是同域,如何在一个tab 向另一个 tab 发消息
兼容性良好(支持 Chrome 54+、Firefox 38+、Edge 79+)。选择方案时需根据具体需求(如兼容性、数据复杂度、窗口关系)权衡。通过 Service Worker 作为消息中转站,实现跨 Tab 通信。现代浏览器提供的专用通信 API,允许同源页面通过命名频道通信。事件,其他同源页面可以监听该事件实现通信。直接支持结构化数据(对象、数组等)。需要直接引用目标窗口对象(如通过。,只有其他 Tab 会收到事件。受同源策略限制,仅限同域页面。复杂场景(如离线、后台同步)
2025-04-25 18:13:13
46
转载 2025年10个强大 CSS 新特性
它们消除了许多 JavaScript 变通方法的需求,让你能够构建更简单、更快、更易于维护的布局和交互。CSS 持续进化,带来了许多新功能,让我们的工作更高效、代码更简洁、能力更强大。以下是十个你可以立即开始使用的亮点功能。这样的函数使得在 CSS 中进行直接的数学运算成为可能,减少了对预处理器或 JavaScript 的依赖。将自定义属性转变为具有类型、默认值和继承规则的完全声明的变量,使得它们可以用于动画等场景。(取余) 这样的新函数进行计算,从而避免了许多 JavaScript 或预处理器的技巧。
2025-04-21 15:35:14
134
转载 Figma MCP Server 介绍:专为 AI 编码工具设计的服务器
Figma-Context-MCP 是一个很有价值的工具,它通过为 AI 提供 Figma 设计的结构化信息,从而增强 AI 编码代理 (如 Cursor) 的能力。Figma-Context-MCP 是一个 MCP (Model Context Protocol) 服务器,旨在向 AI 编码代理 (例如 Cursor) 提供 Figma 文件的布局信息。透过提供结构化的 Figma 布局信息,Figma-Context-MCP 可以大幅改善 AI 的 "one-shot" 准确性。
2025-04-18 16:35:49
288
转载 部署完DeepSeek之后,到底要怎么用好它?
同时,将大模型与数据体系紧密联系起来,探讨业务对数据体系的需求,以及经典数据中台解决方案的优劣,进而提出大模型带来的新机遇和全新的解决方案。看到业界对大模型应用的热切期盼,作者团队决定将自己的实践经验编撰成书,通过介绍项目中积累的技术体系与方法论,助力读者构建起体系化的思维模式,使读者可以具备全局化视野,提出系统化的解决方案。不少企业在信息化方面已经做了大量工作,会针对自身的业务特点构建一套经典数据中台,这对于沉淀好的已知需求的支撑性较好,尤其是大部分已经承载在数据应用系统中的需求,用户能够很方便地应用。
2025-04-16 15:56:43
498
转载 7种在 JavaScript 中分解长任务的技术
动画帧回调函数实际上拥有自己的 “队列”,在渲染阶段的特定时间运行,这意味着其他任务很难插队将其挤到队列的末尾。但它的问题是,没有技术上的保证来确定它何时或是否会运行。来看一个简单的例子:我们在屏幕上有一个用于递增计数的按钮,旁边还有一个大大的循环在执行一些繁重的工作。Scheduler 接口是 Chromium 浏览器相对较新的功能,旨在成为一种一流的工具,用于以更多的控制和更高的效率来安排任务。由它安排的所有任务都会被置于任务队列的前端,防止其他任务插队并延迟执行,尤其是在以如此快速的方式排队时。
2025-04-15 15:20:32
25
转载 前端组件解耦利器:发布订阅模式
虽然像 Redux, Vuex, Pinia 这样的状态管理库有自己的机制,但有时在它们之外,或者在不使用这些库的小型项目中,可以使用 Event Bus 来响应某些状态相关的变化,通知相关组件更新。因此,在使用时需要权衡利弊,遵循最佳实践(特别是取消订阅),并避免滥用,将其用在最适合的场景(如复杂的跨组件通信、模块解耦等),才能真正发挥其价值。这些组件之间经常需要通信和协作。它通过引入一个中介(事件总线),使得组件间的通信可以间接进行,降低了组件之间的依赖关系,提高了代码的可维护性和可扩展性。
2025-04-12 10:25:30
48
原创 到底用merge还是rebase?
,保留两条分支的原始路径。通过上面的对比,我认为rebase在团队合作中会存在一些风险,分支的最新状态,假装你的工作一直基于最新的代码,但。分支,他们的本地历史会与远程冲突,必须手动修复。的区别,帮助你理解它们如何影响提交的历史的。被丢弃(如果分支已推送,需要强制推送。**:其他人能看到一致的历史,直接。更安全的核心原因是不修改历史,而。• 个人分支整理(未推送的提交)。• 生成一个新的 **合并提交。• 公共分支协作(如团队开发)。• 需要保留完整的分支合并记录。**,明确记录分支交汇点。
2025-04-10 17:03:41
369
转载 前端异常隔离:Proxy、Web Workers 与 iframe 的深度对比
Web Workers是浏览器提供的多线程机制,插件代码运行在独立的线程中,完全隔离于主线程,无法直接访问DOM或其他主线程资源。和Proxy的主要区别在于隔离的层次:Proxy是逻辑层面的隔离,而Web Workers是物理层面的线程隔离。iframe虽然提供了浏览器级别的隔离,每个iframe有独立的渲染进程和JavaScript执行环境,但它的资源消耗较大,每个iframe需要加载完整的文档环境,对于需要频繁创建和销毁的场景不合适。:终极隔离,但成本和复杂度较高,适合完全不可信内容。
2025-04-08 19:57:15
88
转载 深入解析前端插件机制:以埋点SDK与Webpack为例
最近在做前端监控的全链路项目, 刚好埋点SDK这边的架构设计需要用到插件机制, 就想着和之前学过的webpack插件机制进行一个类比, 看看有哪些共通和差异之处。在现代软件开发中,插件机制是实现系统扩展性和灵活性的核心设计模式之一。插件机制通过将核心功能与扩展功能分离,使得系统能够在不修改核心代码的情况下扩展能力。:ByteTop 的监控场景要求“永不中断”,Webpack 的构建场景允许“快速失败”。为例,深入探讨两者的插件机制设计异同,并揭示其背后的设计哲学。
2025-03-31 18:44:25
47
原创 面试官最想听到的Vue和React区别
例如,可以仅使用核心库实现基础功能,再按需引入Vue Router(路由)、Vuex(状态管理)、Vue CLI(构建工具)等。:React拥有庞大的生态系统,包括React Router、Redux、Axios、Ant Design等,且持续引入创新方案(如React Query、Zustand)。:React强调“声明式UI”,通过JSX语法将UI描述为纯函数,开发者只需定义状态(State)和UI的映射关系,React自动处理UI更新。)等,语法更接近传统HTML,适合传统前端开发者。
2025-03-25 11:37:35
782
转载 说说你对esbuild和swc的理解?
内置代码压缩、Tree Shaking 功能,支持 JS/TS/CSS 的简单处理(需插件扩展复杂功能)。:缺乏复杂资源处理能力(如图片、字体),需配合其他工具(如 Rollup)完成完整构建流程。实现,利用多线程并行处理和高效内存复用机制,性能远超传统工具(如 Webpack)。:不支持 ES5 降级(仅到 ES6)、装饰器语法,且无法操作 AST。:缺乏打包能力(swcpack 不成熟),需配合其他工具完成构建。:复用 AST 结构,避免传统工具链多次解析 AST 的开销。
2025-03-24 19:58:05
93
原创 简单粗暴啊!对比SolidJs和React。。。
SolidJS 确实在设计上借鉴了 React 的诸多特性,但底层机制却有本质不同。欢迎自荐投稿到《前端技术江湖》,如果你觉得这篇内容对你挺有启发,记得。一、SolidJS 与 React 的相似与差异。:即使只有 1 个数据变化,也要重新渲染整个组件。3.1 React 更新流程(简化的伪代码):先计算虚拟DOM差异,再操作真实DOM。:每个状态变化只更新对应的 DOM 节点。:直接操作真实DOM,无中间计算层。:提前确定状态与DOM的依赖关系。SolidJS(直接DOM):提前建立状态与DOM的关联。
2025-03-21 12:22:49
374
转载 如何在前端开发中实现零停机部署
在本文中,我们将探讨在前端开发中实施零停机部署的实用策略,帮助你平稳地交付更新,而不影响用户的体验。零停机部署是一种技术,通过这种技术,对应用程序或网站的更新可以在不造成任何服务中断的情况下进行部署。这种方法可以在不向所有用户暴露新功能的情况下,在实际环境中测试新功能,从而在管理新功能发布的同时实现零停机。功能标志,也称为功能切换,可以让你在不部署新代码的情况下控制新功能或更新的可见性。自动化有助于维持可靠且可重复的部署过程,从而实现更快更高效的更新,并最大限度地减少潜在的停机时间。
2025-03-19 19:39:56
79
原创 破防了!原来Vue响应式设计的如此巧妙
Vue 响应式系统的巧妙之处在于: 自动依赖收集:不需要手动声明依赖关系,Vue 会在数据被访问时自动建立依赖关系 精确更新:只有真正依赖某个数据的视图才会在该数据变化时更新,而不是整个应用重新渲染 深度响应:对象的嵌套属性也能被监听,因为 Observer 会递归地将嵌套对象也变成响应式的。Vue 的响应式系统是其最核心的特性之一,它让我们通过简单地声明数据与视图的关系,而不需要手动操作 DOM。Watcher 就像是一个"侦探",负责监视数据的变化,并在变化时执行特定的操作,如更新视图。
2025-03-18 17:30:58
574
原创 30分钟扩展七牛云图片上传功能
https://developer.qiniu.com/kodo/manual/upload-token),我整理了一个简单可用代码,在node下执行就可以输出token。自己做网站、做小程序时我一般都用七牛来存储图片,如果产品日常更新有较多图片,那么直接使用七牛上传就会很麻烦。我希望能尽量的省事儿,不需要登录,可以直接从剪贴板上传图片,上传后能直接得到cdn的地址。token的获取必须通过服务端拿到,前端无法获取。只要有上传token就可以把图片上传到自己的七牛空间里。(其实调教AI撸一个)
2025-03-17 17:39:48
268
原创 cursor已经到这种地步了?2分钟开发一个AI生图功能
接口文档 @https://docs.siliconflow.cn/cn/api-reference/images/images-generations。上面的页面布局和功能开发,如果纯手写需要多久?然而cursor2分钟就搞定了。这次用cursor开发一个ai生图功能,基本上一句话就能把整体功能完成80%。(当然这不重要,出图质量和提示和模型都有关系,目前使用的是免费模型)在xxx目录内实现输入prompt就能生成图片的功能,然后再对细节布局和功能进行调整就可以。或者点击左下角阅读原文。
2025-03-14 19:51:58
280
转载 尤雨溪:围绕Vite的前端统一工具链(D2 终端技术大会)
本文由@前端技术江湖整理,转载请注明出处刚看完D2终端技术大会上的尤大大的分享,顺便把关键信息记录了一下,方便快速浏览。信息量很大,收获很多。完整视频在最后!成立的自己的公司 - void(0)...
2025-03-11 18:12:04
80
原创 Vite为什么选用Rollup打包?
Vite 在生产阶段使用Rollup打包,但这不是唯一选择。它的设计背后有明确的权衡和考量,同时开发者也可以选择其他替代方案。一、为什么 Vite 默认使用 Rollup?1.Rollup 的核心优势•Tree-shaking:Rollup 的静态分析能力极强,能精准剔除未使用的代码(Dead Code Elimination),生成更小的产物体积。•输出格式灵活:支持 ESM、Comm...
2025-03-10 08:09:43
773
转载 Vue 3.6 将带来这些重磅功能,更快、更强!
Vue 3.6 将带来这些重磅功能,更快、更强!在不久前举办的 Vue Nation 大会上,Vue 作者尤雨溪分享了即将发布的 Vue 3.6 的新特性:① Alien Signals 1.0 的集成(p2-p3):Vue 3.6 将 Alien Signals 1.0 移植到 v3.6 分支,重构了响应式系统,显著减少了依赖追踪的开销,降低了内存使用,提升了响应式数据追踪的性能。Alien S...
2025-03-09 09:01:50
80
转载 用了就离不开的13个cursor特性!
最开始接触 cursor 的时候是在去年年初,openAI ChatGPT 带火了一批 AI 概念产品。GitHub 的 Copilot 自不用说,很早就在使用,有了大模型的加持当时也是如日中天。 我记得 cursor 当时主打的点是:可以无逢迁移 vscode ,vscode 的所有插件可以直接一键转移到 cursor。连界面都一模一样轻巧、快速。体量小,启动快,编程效率高可用免费的 AI 模型...
2025-03-08 19:25:45
389
1
转载 DeepSeek 锐评国内前端现状
在前端圈,总是能听到各种吐槽不断。我的好友 迪普斯克 看在眼中,记在心中。乘着周末的空闲,邀请它来锐评一下。以下内容仅供周末娱乐,切勿入戏太深。(把腿架在八仙桌上,烟斗在桌角磕出火星子)兄弟们,这前端江湖的水,比他娘的黄四郎的银子还浑!老子今天把话撂这儿:一、框架换得比窑*的姑*还勤!(拍案而起)今天 Vue 明天 React,后天 Svelte都能吹成屠龙刀!你们是写代码还是逛八大胡同呢?老子刚...
2025-03-06 23:40:29
75
转载 基于web-see的前端监控方案实现
1、需求背景最近在研究前端项目的监控,找到了web-see这个工具,jake/web-see[1],还有使用demo,github.com/xy-sea/web-…[2]。这个工具提供了上报错误、定位错误源码、记录用户行为等功能。2、实现方案参考web-see-demo,运行node服务,提供接口:错误上报、错误列表查询、获取源码等该接口。为了实现获取源码的功能,需要将前端项目sourcemap...
2025-03-02 08:18:39
71
转载 大厂都在做的前端稳定性到底是啥呢?
引言在一次公司的前端无法访问的事故复盘后,我们调查了关于应用稳定性前端可以做些什么。对于前端稳定性其实在整个用户访问到页面到请求都需要全链路的监控与追踪,每一个环节都值得我们深入探究一下。本文就从应用服务器、静态资源、页面渲染、接口请求4大方面来各个击破,看看前端稳定性到底需要如何建设。应用服务器应用服务器在整个链路的最上游,从用户在地址栏输入域名访问后,流量通过网关(由于网关层的稳定性在大多数公...
2025-03-01 23:58:27
61
转载 2025-React 生态系统
导读:这是国外程序员 Robin Wieruch 带有明显个人色彩的一份总结,每年都会更新。相比于awesome 列表[2],我个人更喜欢这类总结,简短、实用,更容易让人抓到重点并能立即实施。React 的是一个由组件驱动的 UI 框架,JSX 以及 React Hook 都是其首创的先进理念。经过多年的发展,React 拥有一套非常庞大的生态系统,不过这也导致从其他库/框架转过来的开发人员带...
2025-02-26 13:24:49
161
转载 一次性上传 1000 张图片, 总量 10GB 的方案设计
背景最近有一个上传文件方面的需求,上传图片,用户可以选择文件夹上传。文件夹里的图片可能很多,而且由于特殊的项目背景,用户选择的图片可能会比较大,10MB左右。这里就需要做一些方案上的设计了,确保整个过程的流畅和容错。方案设计这个过程中需要考虑到的细节主要是以下几点:重复图片的认定图片上传任务的控制上传失败和上传中断处理图片去重hash图片去重这一块,我们可以在前端做hash,但是对于...
2025-02-25 23:26:17
51
转载 AI能写出这些代码吗?分享一些不错的JS/TS代码片段
整理笔记的时候发现之前存的一些写得还不错的代码片段,分享出来参考参考,可能后面就直接让AI写了。方法顺序执行,不论同步还是异步以下代码实现方法顺序执行,不论同步还是异步,letresult;for(constfof[func1, func2, func3]) { result =awaitf(result);}/* use last result (i.e. result3...
2025-02-21 19:37:31
32
转载 aiCoder:利用AST实现AI生成代码的合并工具
作者:@Mike Molinari项目:https://github.com/mmiscool/aiCoder背景Mike Molinari 最近发布了一个名为aiCoder的项目,这是一个利用抽象语法树(AST)技术来实现 AI 生成的代码片段与现有代码文件无缝合并的工具。与传统的基于行的合并方法不同,aiCoder 通过解析代码的语法结构,确保 AI 生成的代码片段能够以 “外科手术般的精...
2025-02-18 13:23:47
90
转载 React 首次推出原生的动画支持!
React 一直是前端开发者最受欢迎的框架之一。但是 React 的动画支持似乎一直是个短板。虽然 Vue 和 Svelte 等其他框架相继推出了便于实现动画的 API ,React 开发者长期以来不得不依赖于第三方库,如 Motion for React 和 React Spring 来补足这一缺陷。最近,这种情况终于迎来了转机。React 团队即将推出了一个名为 <ViewTransit...
2025-02-17 23:32:23
60
转载 Create React App被官方弃用!该如何搭建新的 React 项目?
在前端技术日新月异的今天,React 社区已经不再将 create-react-app 作为创建新项目的首选工具,而是推荐使用社区中流行的由 React 驱动的框架来创建新项目。本文就来探讨在 2025 年创建 React 项目的方式及其优缺点!Create React App 有什么问题?Create React App(CRA)于 2016 年 7 月首次发布,是一个方便快捷的 React 项...
2025-02-13 13:26:51
317
转载 DeepSeek启示录!
腾讯云近日推出了 HAI 上的一键部署、3分钟可用的 DeepSeek -R1 实例,由于过于火爆,排队等待之余,写一写我对 DeepSeek 的思考。对于大语言模型 AI 的应用,我属于比较乐观的人群,在2022年9月就在信通院的可信数字化公号里写了一篇对未来应用的预言,2023年5月又在信通院的低无代码峰会上,随着腾讯和百度工程师现场演示的自然语言+大语言模型+低代码三位一体的开发方式,我感慨...
2025-02-10 10:02:11
2361
转载 5大 零JavaScript Rust 框架崛起,前端瑟瑟发抖
前言本文主要和大家讨论全网最火的5个基于Wasm 的 Rust 框架,使得开发者不用编写一行JS代码就可以写前端应用。在年初,我也确实使用 WebAssembly 将客户端应用成功移植到了 Web,这也是为什么我一直对 WebAssembly 充满好奇的原因。正如大家所看到的,当我们还在迟疑是否要在日常开发中引入 WebAssembly 的时候,很多优秀的应用、工具已经开始吃 WebAssembl...
2025-02-09 21:01:06
105
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人