自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(21)
  • 收藏
  • 关注

原创 OpenManus 开源AI智能体框架

OpenManus是一款开源AI智能体框架,支持多模态输入和复杂任务处理。安装流程包括:1)准备WSL2环境;2)使用uv工具快速安装;3)配置API密钥;4)启动终端或WebUI交互。项目亮点包括多模态协同、低门槛部署、模型灵活适配和丰富实战场景,适合自动化办公和AI开发学习。常见问题解决方案和扩展建议也一并提供。

2025-10-09 18:36:12 902

原创 成为”前端架构“---第五天 【从栈帧到栈溢出】

本文深入解析JS调用栈机制,从基础概念到实际应用。调用栈是JS执行函数的核心数据结构,采用"先进后出"原则管理执行上下文。文章通过餐厅取餐台的生动类比,结合代码示例演示调用栈的压栈/弹栈过程,并详细讲解执行上下文的三大组成部分:变量环境、词法环境和this绑定。还介绍了使用Chrome DevTools调试调用栈的实用技巧,以及解决栈溢出问题的三种方法(终止条件、迭代替代、尾递归优化)。最后解答了调用栈与JS单线程的关系,帮助读者全面掌握这一重要概念,提升代码调试和面试表现能力。

2025-09-28 23:13:31 883

原创 “前端架构” -- 第四天 Promise / async

本文介绍了Promise和async/await的简易实现与实战应用。通过手写MyPromise类实现异步链式调用,并模拟用户信息加载流程展示其优势。async/await基于Generator函数和自动执行器,使异步代码更接近同步风格,提升可读性。核心原理在于:Promise通过状态管理和链式调用解决回调地狱,而async/await则利用Generator的暂停/恢复特性实现异步流程控制。这两种方式都是现代JavaScript处理异步操作的重要工具,理解其底层原理有助于开发者更高效地编写异步代码。

2025-09-27 16:49:29 304

原创 前后端分离项目 -- 文件创建规范

Vue3 + Vite 项目规范搭建指南 本文详细介绍了中大型 Vue3 + Vite 项目的标准目录结构和规范实践,主要内容包括: 根目录配置:核心配置文件说明,如环境变量、ESLint/Prettier 配置、Vite 设置等 src 业务目录: assets:静态资源分类管理 components:按复用范围划分公共/业务组件 views:页面级组件按路由组织 router:模块化路由配置 store:Pinia 状态管理模块化 开发规范:强调组件职责分离、代码复用、类型安全(TypeScript)等

2025-09-26 20:21:14 1590

原创 “前端架构” 第三天 常用CSS 知识点总结

本文系统解析CSS高级知识点,涵盖Flexbox弹性布局、Grid网格布局及响应式适配等核心技术。详细讲解flex-grow/shrink/basis计算逻辑和嵌套布局应用,通过实战案例演示如何实现复杂二维布局。同时介绍Grid布局的网格线定位和fr单位比例分配,提供可直接复用的代码示例,帮助开发者掌握CSS布局原理并应用于实际项目。

2025-09-26 16:35:37 852

原创 “前端架构“ 实战篇 -- 水印图片

本文介绍了一个基于Canvas和TailwindCSS的前端图片加水印工具,具有以下特点: 技术栈:使用HTML5 Canvas实现核心绘图功能,TailwindCSS构建响应式UI,原生JavaScript处理交互逻辑 核心功能: 支持点击/拖拽上传图片 高度自定义水印(文字、位置、透明度、颜色、旋转角度) 实时预览对比原图和水印图 本地下载处理后的PNG图片 优势: 纯前端实现,保护隐私无需上传服务器 轻量高效,兼容性好 提供完整可直接运行的源码 文章包含详细的技术选型说明、功能展示和完整的HTML代码

2025-09-26 13:55:53 834

原创 “前端架构” 实战篇--离线笔记 第二天

本文介绍了一个基于前端技术的离线笔记工具实现方案,采用localStorage+IndexedDB双存储架构。localStorage负责快速存取当前笔记数据(约5MB容量),而IndexedDB则用于存储历史版本(无明确容量限制),既保证了性能又实现了版本回溯功能。工具支持笔记的创建、编辑、删除和版本管理,核心代码展示了存储初始化、CRUD操作以及双存储协同机制,如自动备份旧版本到IndexedDB、内容变更检测等。该方案适合需要离线使用且注重数据安全的场景,代码简洁可直接复用。

2025-09-25 16:18:22 1063

原创 “前端架构” 语义化标签 与 自定义属性(data-*)

本文探讨了前端工程化中语义化标签和自定义属性的最佳实践。语义化标签不仅提升代码可读性,更是工程化的基础,通过分层明确的结构契约(如<header>/<main>/<footer>)、ARIA属性和模块化标记(data-module)实现可维护性和可访问性。在组件化开发中,语义化标签形成统一的结构规范(如商品卡片使用<article>),而自定义属性(data-*)则通过规范的命名体系(如data-goods-id)实现DOM与逻辑层的高效通信。文章提供了电商首

2025-09-25 15:12:42 911

原创 成为“前端架构”第一天

前端架构学习路线总结 本文系统梳理了前端架构师成长路径,分为四个阶段: 基础巩固(1-3个月) 深入HTML5/CSS3/JS核心原理 掌握React/Vue框架设计思想 理解浏览器渲染机制与性能优化 工程化落地(4-6个月) 掌握Webpack/Vite构建工具 实现组件化开发与规范化流程 性能监控与优化方案实践 架构设计 微前端/SSR等架构模式 技术选型与系统设计能力 综合能力 跨端方案与全栈视野 每个阶段均包含具体知识点、学习目标和实践验证,形成可执行的前端进阶体系。

2025-09-24 15:23:46 1112

原创 不会吧!JavaScript 大文件上传切片 @思路 就这么简单吗?

JavaScript 大文件上传切片思路

2022-12-27 16:51:19 357

原创 我想你需要看一下 前端开发常见的几种设计模式

前端开发中常用的几种设计模式单列模式构造函数每次被创建对象,只有一个被创建​ 单例模式是JavaScript最简单的设计模式之一。属于创建型模式,提供看一种创建对象的最佳方式简单来说就是没有就创建,有就使用,只有一个私有构造函数声明静态单列对象构造单列之前要加锁需要二次检查单例实例是否为空,分别在锁之前和锁之后var single = (function(){ var demo; return function(name){ if(demo){ return demo

2022-02-06 14:56:55 360

原创 来了来了,这还看不懂?事件委托封装

事件委托(事件代理)事件委托就是利用事件冒泡,只指定一个事件处理程序,就可以管理某一类型的所有事件例子:取快递有三个同事会在今天下午点了外卖。为了拿外卖,有两种办法:是三个人在门口等外卖;是委托放前台。现实开发例子:多个li有相同的点击事件,一开始我们想的是使用for循环遍历所有的li,并且给他们添加上点击事件后果:添加到页面上的事件处理程序数量将直接关系到页面的整体运行性能,因为需要不断的与dom节点进行交互,访问dom的次数越多,引起浏览器重绘与重排的次数也就越多,就会延

2022-01-23 16:52:17 501

原创 不会吧不会吧,还看不懂?简单封装一下深浅拷贝

2.递归和Stringify和parse实现深拷贝//判断类型function getType(o){ let fn={}.toString //{}==Object.prototype(表示一个空对象) //[object undefined] return fn.call(o).slice(8.-1).toLowerCase()}function copy(obj){ //数组的处理 if(getType(obj)=="array"){ let resul

2022-01-20 13:59:41 569

原创 不会吧不会吧 这个还看不懂啊

1、什么是防抖和节流?有什么区别?如何实现?防抖触发高频事件后n秒只会执行一次,如果n秒内高频事件再次被触发,会重新计算事件思路每次触发事件时都取消之前的延时调用方法代码let time=null//使用延时定时器设置防抖动btn.onclick=funtion(){ clearTime(time) time=setTimeout(()=>{ 请求数据 },1000)}//进阶封装function debounce(callback,delay){ //利用闭

2022-01-20 13:56:51 461

原创 Javascript词法结构

Javascript词法结构命名JavaScript是区分大小写代表这是什么?​ 关键字,变量,函数名和其他的标识符必须始终保持一致的大小写形式​ while关键字就必须写成while 不能写成While or WHILE注释JavaScript二种注释单行注释 //多行注释 /* */​ 注意可以跨行但是不能嵌套字面量什么是字面量是一种直接出现在程序中的数据值"a" //字符串1.2 //数字true //布尔值·null //

2021-08-27 19:21:01 176

原创 JavaScript内置对象

JavaScript基础String对象:字符串对象,提供了对字符串进行操作的属性和方法。Array对象:数组对象,提供了数组操作方面的属性和方法。Date对象:日期时间对象,可以获取系统的日期时间信息。Boolean对象:布尔对象,一个布尔变量就是一个布尔对象。(没有可用的属性和方法)Number对象:数值对象。一个数值变量就是一个数值对象。Math对象:数学对象,提供了数学运算方面的属性和方法。String对象一.chartAt()与charCodeAt()**chartAt()**以

2021-08-27 19:18:27 178

原创 JavaScript原始类型

原始类型(不可修改)(数值,字符串,布尔值,unll,undefined,Symbol(符号))虽然它们不可被修改但是可以自由的切换不同类型的值NumberNumber用于表示整数和近似实数(但是定义Number的数值是范围)超出这个值会带来精度上面的损失算数操作符来操作数值,包括 加+ 减- 乘* 除/ 余% 去幂**还有Math对象的属性提供 可以支持更加复杂的数学计算关于Number出现的二个常量NaN(非数值)特殊的的特性,它和任何值都不相等,意味

2021-08-27 19:10:27 336

原创 技术:Vue express-generator生成器,分享一句话

为什么我们越来越长大,觉得时间过得很快呢?我们总会感觉这一周过的好快啊!是啊马上就周末了哈哈哈,开心还是不开心呢,其实我也很疑惑我们对时间的感知,跟我们吸收、处理、储存的信息量紧密相关所以说这样一句话 如果你一天觉得是充实还混日子,你可以每天睡觉的时候想一想自己干了啥,如果可以回忆很多的话,这一天是有意义的,如果你发现没有什么可以回忆,嗯我想这一天是失败的!最后总结一个技术吧1.安装express-generator生成器执行 $ npm install express-generator

2021-07-30 14:17:11 451

原创 Element UI框架 Vue脚手架 改变样式

在最近的时间,和同事一起去做一个项目,前端UI框架里面我在听别人说Element这个UI框架很好用于是我开始也尝试去使用问题一:需要改变Element样式网上收集了很多的内容首先感谢 一下博主 这是他的文章地址https://blog.youkuaiyun.com/hu741308125/article/details/103601135ok!我总结一下关于这个UI框架的修改样式这个地方如果需要更改 暂时还没有成功 但是如果你要添加一些CSS样式进去是可以,但是要改变行内样式,就很麻烦 暂时还没

2021-07-28 13:56:22 206

原创 2021-06-29

关于Node学习欢迎使用Markdown编辑器你好! 这是你第一次使用 Markdown编辑器 所展示的欢迎页。如果你想学习如何使用Markdown编辑器, 可以仔细阅读这篇文章,了解一下Markdown的基本语法知识。新的改变我们对Markdown编辑器进行了一些功能拓展与语法支持,除了标准的Markdown编辑器功能,我们增加了如下几点新功能,帮助你用它写博客:全新的界面设计 ,将会带来全新的写作体验;在创作中心设置你喜爱的代码高亮样式,Markdown 将代码片显示选择的高亮样式 进行展

2021-07-02 19:13:37 163 2

原创 2021-07-02

Node 学习什么是node.js为什么要学习Node为什么要学习node?node最大的卖点就是完全异步的I/O模型异步的I/O模型极大的提高了web服务的并发性,对于I/O密集型应用,会有很明显的性能提升比如说:聊天室这个项目,因为它会大量使用Ajax 每一个Long-Polling都会去占据服务器的一个连接数,算然会有大部分连接是出于空闲状态,但是web本身的并发性就不是很强,最终会走向崩溃,但是node就可以很好的处理这个问题!有人可能会说,js本身是一个单线程的东西,node难

2021-07-02 18:43:39 115

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除