- 博客(58)
- 收藏
- 关注
RSS订阅
原创 我的第一个开源项目：前端逐梦之旅与开源荣耀之巅 - vue
我相信，在开源的道路上，我将继续砥砺前行，用代码书写更多的精彩，为开源社区贡献更多的力量
2025-07-22 15:40:07
1241
原创 TCP三次握手 四次挥手/以及全双工通信
TCP协议通过三次握手和四次挥手实现可靠连接管理：三次握手（SYN、SYN-ACK、ACK）确保双方同步序列号并建立连接，防止失效请求；四次挥手（FIN、ACK、FIN、ACK）实现全双工连接的优雅断开。全双工通信允许双向同时传输，WebSocket是其典型应用，相比HTTP轮询具有低延迟优势。现代网络（如TCP/IP）和电话系统都采用全双工模式，通过物理通道分离（如双绞线）或时分/频分技术实现双向传输，显著提升吞吐量和交互体验。
2025-11-20 15:39:56
717
1
原创 当你在地址栏输入完内容之后并按下回车，发生了什么？？？ 为啥第二次搜索比第一次要快 ？？？
本文详细解析了在浏览器输入网址后发生的完整请求过程：从DNS解析、TCP三次握手建立连接，到HTTPS的TLS安全协商；从发送HTTP请求到服务器处理响应；最后介绍了浏览器渲染页面的关键步骤（构建DOM/CSSOM树、布局和绘制）。文章特别解释了缓存机制导致二次访问更快的原因（DNS缓存、资源缓存、TCP连接复用），并提供了清理缓存、使用无痕模式等优化浏览体验的实用建议。全文通过流程图和分步说明，系统性地揭示了网页加载背后的技术原理。
2025-11-20 15:31:48
864
2
原创 vue3 elementplus 多选加搜索组件
多选功能 vue3 + elementplus 开发的 多选加搜索功能组件 可以根据状态进行设置不可选中 开箱即用
2025-10-16 14:59:17
196
原创 国内 CDN 配置详细流程（以腾讯云 COS + CDN 为例）
引入，可以显著提升资源加载速度、减少服务器带宽压力，并利用 CDN 的缓存机制优化用户体验。通过以上步骤，你可以成功将图片迁移到 CDN，并显著提升项目中的图片加载速度。通过以上方法，你可以高效地将项目中的图片迁移到 CDN，并兼顾性能与可维护性。在项目中将图片从本地引入改为使用。
2025-07-31 18:02:04
2840
原创 Vue3 + TypeScript 项目国际化实现（Pinia + 持久化）
typescript// 修改 store 配置persist: {key: 'my-app-locale', // 自定义存储键名storage: sessionStorage, // 使用 sessionStorage 替代 localStoragepaths: ['currentLocale'] // 只持久化特定路径},// ...其他配置保持不变})完整的持久化：用户语言偏好存储在 localStorage/sessionStorage 中响应式更新：语言切换后所有组件自动更新。
2025-07-31 11:28:26
768
原创 资讯头条（移动端vue项目）
首先描述自己所做项目有哪些功能模块，然后描述其中单个模块有哪些功能，再对其中的一个单独功能进行详细描述，中间可以穿插一下遇到的技术问题，循环往复，和面试官保持平等对话。举例：我在上家单位最近做的项目是一款移动端项目,主要有文章列表,搜索模块,个人设置等,我在其中负责,首页数据渲染,个人中心设置,其中在个人设置模块中,使用socket.io实现了在线客服咨询功能,并且该项目整体开发完毕之后,使用Gzip打包优化项目,并且利用HbuilderX打包成了一款混合是app。
2025-07-30 16:32:14
314
原创 粉丝头条（PC端vue项目）
首先描述自己所做项目有哪些功能模块，然后描述其中单个模块有哪些功能，再对其中的一个单独功能进行详细描述，中间可以穿插一下遇到的技术问题，循环往复，和面试官保持平等对话。举例：我在上家单位最近做的项目是一个基于vue开发的什么类型项目，我负责的模块有发布文章，评论管理，以及文章列表等，其中发布文章主要包括使用富文本编辑器实现对文章的修改，审核发布，单独抽离封装组件，实现业务详细分化，并且实现素材上传管理，在发布文章中，使用了element-ui的表单组。
2025-07-29 15:53:32
361
原创 react.js 基础知识点
JSX 是JavaScript XML 的简写，是 react 使用的一种文件，它利用 JavaScript 的表现力和类似 HTML 的模板语法，得 HTML 文件非常容易理解。此文件能使应用非常可靠，并能够提高其性能，浏览器只能处理 JavaScript 对象，而不能读取常规 JavaScript 对象中的 JSX，所以为了使浏览器能够读取 JSX，首先，需要用Babel转换器将 JSX 文件转换为 JavaScript 对象，然后再将其传给浏览器1、函数式定义的无状态组件。
2025-07-25 11:20:54
790
原创 webpack 基础知识点
1、基本定义wbpack是一个打包模块化javascript的工具，在webpack里一切文件皆模块，通过loader转换文件，通过plugin注入钩子，最后输出由多个模块组合成的文件，webpack专注构建模块化项目，webpack可以看做是模块打包机：它做的事情是，分析你的项目结构，找到JavaScript模块以及其它的一些浏览器不能直接运行的拓展语言（Scss，TypeScript等），并将其打包为合适的格式以供浏览器使用。
2025-07-25 11:05:20
756
原创 node.js 基础/常用知识点
前后端分离的项目前端HTML页面通过Ajax调用后端的RESTFUL API接口并使用JSON数据进行交互JS渲染的项目通过Ajax请求数据以后, 通过JS代码动态创建html的标签和数据等(一般右键查看网页源代码 是看不到渲染后的HTML标签的)前端渲染指的是后端返回JSON数据，前端利用预先写的html模板，循环读取JSON数据，拼接字符串（ES6的模板字符串特性大大减少了拼接字符串的的成本），并插入页面。好处：网络传输数据量小。不占用服务端运算资源（解析模板），模板在前端（很有可能。
2025-07-25 10:59:26
1289
原创 Ajax/计算机网络相关
什么是AjaxAjax是“Asynchronous JavaScript and XML”的缩写。他是指一种创建交互式网页应用的网页开发技术。沟通客户端与服务器，可以在【不必刷新整个浏览器】的情况下，与服务器进行异步通讯的技术Ajax的原理通过XmlHTTPRequest对象来向服务器发异步请求，从服务器获得数据，然后用javascript来操作DOM而更新页面。这其中最关键的一步就是从服务器获得请求数据。
2025-07-24 14:55:35
1155
原创 电脑 C盘瘦身
程序员的工作环境中，C盘（系统盘）常因缓存、临时文件、开发工具、项目依赖等堆积而迅速“爆满”。通过以上方法，你的 C 盘可以从“臃肿大叔”变身“精瘦小伙”，甚至在团队中掀起一场“空间革命”！，涵盖清理策略、工具推荐和防反弹技巧，助你轻松释放空间，甚至在团队中发起“瘦身挑战”！
2025-07-23 16:33:42
899
原创 Git下载全攻略
通过以上步骤，你可以快速掌握 Git 的下载、安装和基础操作，并解决常见问题。建议从实际项目入手，边实践边学习！Git 是全球最流行的分布式版本控制系统，广泛应用于代码管理、协作开发等场景。支持 Windows、macOS、Linux（提供图形化安装包和源码编译方式）。，涵盖安装、配置、基础操作及常见问题解决，适合新手快速入门和进阶用户参考。
2025-07-23 16:23:49
974
原创 ES6新增/特点
区别应用场景Set用于数据重组，Map用于数据储存Set：成员不能重复只有键值没有键名，类似数组可以遍历，方法有add, delete,hasMap:本质上是健值对的集合，类似集合可以遍历，可以跟各种数据格式转换。
2025-07-23 15:37:02
1186
原创 echarts数据可视化
2、解决方法：在mounted()方法和destroy()方法之间加一个beforeDestroy()方法释放该页面的echarts资源，clear()方法则是清空图例数据，不影响图例的resize，而且能够释放内存，切换的时候就很顺畅了。1、echarts是通过canvas来实现的，由于canvas的限制，所以echarts在实现的时候多是绘制一。echarts3.x对echarts的引用更灵活，更简单，方便。4、就是series系列的认识，它是一个数组，数组的每一项都代表着一个单独的系列，可以配置。
2025-07-23 15:04:26
468
原创 JQuery
appendTo()将所有匹配的元素追加到指定的元素中 prepend()：向每个匹配的元素内部前置添加内容 prependTo()：将所有匹配的元素前置到指定的元素中 after()：在每个匹配元素之后插入内容 insertAfter()：将所有配的元素插入到指定元素的后面 例$(A)appendTo(B)是将A追加到B中下面的方法解释类似。2、text()方法，去设置某个元素中的文本内容，代码是var text=$("p").text();'+(+newDate),function(){//内容});
2025-07-23 14:53:54
1046
原创 JavaScript 高级知识点
软件模块之间总是存在着一定的接口，从调用方式上，可以把他们分为三类：同步调用、回调和异步调用同步调用是一种阻塞式调用，调用方要等待对方执行完毕才 返回，它是一种单向调用；回调是一种双向调用模式，也就是说，被调用方在接口被调用时也会调用对方的接口；异步调用是一种类似消息或事件的机制，不过它的 调用方向刚好相反，接口的服务在收到某种讯息或发生某种事件时，会主动通知客户方（即调用客户方的接口）。回调和异步调用的关系非常紧密，通常我们使用回 调来实现异步消息的注册，通过异步调用来实现消息的通知。同。
2025-07-22 11:35:47
1058
原创 WebAPI
1、什么是事件冒泡，他是如何工作的 在一个对象上触发某类事件（比如单击onclick事件），如果此对象定义了此事件的处理程序，那么此事件就会调用这个处理程序，如果没有定义此事件处理程序或者事件返回true，那么这个事件会向这个对象的父级对象传播，从里到外，直至它被处理（父级对象所有同类事件都将被激活），或者它到达了对象层次的最顶层，即document对象（有些浏览器是window）2、阻止事件冒泡的几种方法2.1）第一种：event.stopPropagation();
2025-07-22 11:09:26
973
原创 JavaScript基础
伪数组1、具有length属性2、按索引方式存储数据3、不具有数组的push.pop等方法伪数组（类数组）：无法直接调用数组方法或期望length属性有什么特殊的行为，不具有数组的push.pop等方法，但仍可以对真正数据遍历方法来遍历它们。典型的是函数document.childnodes之类的，它们返回的nodeList对象都属于伪数组伪数组-->真实数组1.使用Arrray.from()--ES6。
2025-07-22 10:51:54
884
原创 Bootstrap响应式开发
媒体查询就是响应式布局。通过不同的媒介类型和条件定义样式表规则。媒介查询让CSS可以更精确作用于不同的媒介类型和同一媒介的不同条件语法结构及用法：@media 设备名 only （选取条件） not （选取条件） and（设备选取条件），设备二{sRules}媒体查询是向不同设备提供不同样式的一种不错方式，它为每种类型的用户提供了最佳的体验。作为CSS3规范的一部分，媒体查询扩展了media属性（控制您的样式应用方式）的角色。
2025-07-19 16:11:01
745
工业总线协议深度解析：从Modbus到PROFINET与EtherCAT
2025-11-14
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人