- 博客(45)
- 收藏
- 关注
原创 Web 前端力荐书目
作为一名前端开发人员,读书其实是一件不算太好的选择。因为前端技术发展的太快,很多书出版时可能有些内容已经过时。再加上技术书一般国外写的比较好,如果翻译成中文在发行,那过期的内容可能更多。虽然如此,但是有一些书个人觉得还是值得一读,尤其是读其中的思想。接下来,我会推荐一些自己读过,并且感觉还不错的书籍。...
2021-01-04 20:46:31
422
原创 LangChain.js 进阶:从 Agent 到 LangGraph
本文探讨了从传统Agent模式向可控性更强的LangGraph架构的演进过程。以电商售后机器人为例,首先分析了传统Agent(LLM+Tools+Executor)的局限性,如黑盒执行、状态管理困难和资源浪费等问题。随后提出了基于LangGraph的优化方案,通过状态机建模将流程拆解为意图分类器、业务节点和工具执行等模块。具体实现展示了如何定义状态、构建意图分类节点和核心业务节点,利用结构化输出来确保路由稳定性。这种架构实现了业务逻辑与闲聊功能的物理隔离,显著提升了系统的可控性和执行效率。
2025-12-24 00:22:09
824
原创 LangChain.js:RAG 深度解析与全栈实践
本文介绍了基于LangChain.js的检索增强生成(RAG)技术实现方案。RAG通过结合信息检索与大模型生成能力,有效解决了传统LLM的知识时效性、私有数据访问和回答可信度等问题。文章详细讲解了RAG工作流程:首先使用Document Loaders加载多种格式数据源(如PDF、网页、CSV等),然后通过文本分割和向量嵌入构建语义索引库,最后利用检索链将相关文档片段与大模型推理结合生成答案。文中提供了完整的代码示例,包括数据预处理、向量存储配置和LCEL链式调用方法,为开发者构建企业级AI应用提供了实用参
2025-12-21 22:58:09
951
原创 LangChain.js 与模型上下文协议(MCP):构建可扩展的 AI 应用新范式
摘要: 大语言模型(LLM)开发中,连接外部工具和API的传统方式依赖定制化“胶水代码”,导致复杂度高。模型上下文协议(MCP)通过标准化接口(类似USB-C),实现即插即用连接,将M×N的适配问题简化为1+1。LangChain.js推出的MCP适配器进一步降低集成门槛,支持快速构建可扩展AI应用。 实战演示: 服务端:基于Express和MCP SDK构建数学计算服务,通过SSE协议与客户端通信,标准化工具描述与执行逻辑。 客户端: 极简模式:使用@langchain/mcp-adapters自动转换M
2025-12-21 17:55:44
995
原创 LangChain.js:Tool、Memory 与 Agent 的深度解析与实战
文章摘要: 本文基于LangChain.js v1.0+框架,系统介绍了构建LLM应用的四个关键阶段:从基础文本生成到智能体(Agent)开发。首先展示了基础模型调用的局限性,随后深入解析Function Call机制,通过天气查询示例演示了原生工具调用的完整流程。接着介绍了LangChain.js的Tool封装方案,利用Zod模式简化工具开发。最后探讨了Memory管理,展示如何通过MemorySaver实现对话上下文持久化。全文通过TypeScript代码示例,为开发者提供了从基础到进阶的LLM应用开发
2025-12-21 14:30:59
869
原创 LangChain.js:Message、Model 与 LCEL 核心解析
摘要: LangChain.js为构建大语言模型应用提供了三大核心组件:Message(标准化消息格式,如SystemMessage、HumanMessage等)、Model(统一LLM调用接口,支持同步/流式/批量处理)和LCEL(声明式组合语法)。通过.pipe()方法,开发者可将提示词、模型和解析器串联成可复用流程,并支持并行处理(如RunnableMap)。该框架显著简化了多模型集成、流式响应和复杂推理链的开发,尤其适合全栈和Serverless场景。
2025-12-21 01:07:39
745
原创 LangChain 框架前世今生:从“万能接口”到“AI 应用全家桶”
摘要:随着大语言模型(LLM)的兴起,开发者面临API接口不统一和厂商锁定的痛点。LangChain应运而生,作为标准化中间层,封装各大厂商API,提供统一接口。其核心功能包括Model I/O、Chains、Agents等模块化设计,并通过LCEL语言简化链式调用。LangChain已发展为包含核心框架、LangGraph智能体框架和LangSmith运维平台的完整生态,支持Python和TypeScript,广泛应用于知识库助手、智能客服等领域,成为LLM应用开发的重要工具。
2025-12-20 23:01:01
1217
原创 深入前端图片压缩
前言任何研究都不是凭空产生,至少博主是这样的。在手机端拍照后图片很大,有的甚至有 10M 多。这个时候再去上传图片,可想而知,速度是很慢的。正因如此,便有了前端图片压缩这个需求。图片格式传统的图片格式有 git、jpg/jpeg、png 等,谷歌后来推出了另一种压缩比更高的格式 webp。在介绍这几种图片格式前,先说下图片的一些特性。有损和无损有损:指在图片压缩过程中,会丢失一部分图片信息,并且这种丢失是不可逆的。无损:指在图片压缩过程中,图片质量没有损失,任何时候都可以从无损压缩过的
2021-06-03 06:09:37
3938
原创 Vue Router 源码之 hash 与 history 模式
相信用过 Vue 框架的朋友,一定听过 Vue Router。要想写一个复杂的单页应用,没有路由可不行。Vue Router 默认开启的是 hash 模式,如果我们不想让浏览器中的 URL 包含影响美观的 #,我们可以开启 history 模式。不过这种 history 的模式稍微复杂一点,需要后端服务器配合。学东西,最好是知其然,知其所以然。本文将从源码的角度分析 hash 与 history 这两种模式的实现,本文基于 Vue Router 3.5.1 版本。单页应用当我们在浏览器地址栏输入一个
2021-03-11 23:16:28
596
原创 Vue 源码之 nextTick
前言为什么要写一篇关于 nextTick 的源码分析呢?主要是因为 nextTick 与 JS 的事件循环(Event Loop)有关,这块知识还是比较重要的,尤其当我们的程序复杂了,很可能就会遇到因为 JS 顺序顺序导致的问题。事件循环JS 执行是单线程的,它是基于事件循环的。事件循环大致分为以下几个步骤:所有同步任务都在主线程上执行,形成一个执行栈(execution context stack)。主线程之外,还存在一个"任务队列"(task queue)。只要异步任务有了运行结果,就在"
2021-03-09 00:09:57
299
原创 Vue 源码之 computed 和 watch
学如逆水行舟,不进则退!当今社会,很美好,也很残酷。一般软件或互联网公司,大多数的业务其实是没有很高的难度,所以员工也没有什么机会去提升自己。不过值得庆幸的是,编程界开源风气盛行,功夫秘籍随手可得,而代价仅是你的时间。本次文章的主题是 computed(计算属性) 和 watch(侦听器),代码基于 Vue 2.6.11 版本,和 2.5 还是有一些区别。用法回顾我们先来简单回顾下 computed 和 watch 的用法。computedexport default { name: .
2021-03-07 01:55:51
516
原创 算法系列之链表
链表和数组有点类似,都是线性表的一种,但是它们又有很大的不同。数组需要一块连续的内存空间来存储,而链表恰恰相反,它并不需要一块连续的内存空间,它通过“指针”将一组零散的内存块串联起来使用。
2021-02-09 10:01:21
259
原创 Web 性能优化之渲染层
在上一篇《Web 性能优化之传输层》介绍了传输层浏览器和网络所做的事情,以及根据这期间的情况我们可以做出的优化。这一篇,我将介绍浏览器的渲染流程,以及根据渲染流程我们可以做出的优化。浏览器渲染流程浏览器架构在介绍浏览器渲染流程之前,我们先来简单看一看浏览器的架构。这里我主要介绍 Chrome 的架构,毕竟它目前全球占有率第一。现代浏览器采用的多进程架构,避免单进程导致的不稳定、不流畅、不安全的问题。当我们打开浏览器时,浏览器至少会开启 4 个进程。其中浏览器主进程、网络进程、GPU 进程是所有
2020-12-15 01:00:15
726
1
原创 Web 性能优化之传输层
Web 性能优化是一个老生常谈的问题,以前看了很多零碎的知识,所以一直想找个机会好好总结一下。Web 性能优化涉及的面很广,这里我从前端的视角讲一讲优化点,主要分为传输层和渲染层。这篇文章,我讲述的是传输层。渲染层的优化会另外写一篇进行讲解。输入网址到页面呈现,中间发生了什么“输入网址到页面呈现,中间发生了什么”这个是很多面试官喜欢问的一个问题。为什么喜欢问呢?因为这个问题覆盖了很多计算机网络的问题,如果你答得好,那么可以表明你的计算机网络基础还不错。很多性能问题就发生在这个过程中,如果你想很好
2020-12-07 20:55:39
570
1
原创 算法系列之二叉树
二叉树相关概念由于本篇博文主要介绍二叉树的面试题,所以关于其相关概念只做简单的描述。二叉树简介数据结构中有一种结构是树,不过一般我们常见的是树中的一种特殊类型——二叉树。二叉树简单来说就是每个节点最多有两个子节点。如果每个节点都有两个子节点,那么我们称这种二叉树为满二叉树。还有一种二叉树,其叶子节点都在最底下两层,最后一层叶子节点都靠左排列,并且除了最后一层,其他层的叶子节点都要达到最大,这种二叉树叫作完全二叉树。除了上面那些,这里还需要特别提到一种树,二叉搜索树。二叉搜索树要求,在树中的任意
2020-09-09 22:48:11
335
原创 算法系列之动态规划算法
动态规划比较适合用来求解最优问题,比如求最大值、最小值等等。它可以非常显著地降低时间复杂度,提高代码的执行效率。不过,它也是出了名的难学。它的主要学习难点跟递归类似,那就是,求解问题的过程不太符合人类常规的思维方式。对于新手来说,要想入门确实不容易。不过,等你掌握了之后,你会发现,实际上并没有想象中那么难。
2020-05-16 00:47:18
5723
原创 算法系列之经典排序算法
说到算法,入门级的算是排序算法了。还记得读大学时,学的第一个是冒泡排序。初次接触算法,觉得很神秘,一个冒泡竟然搞了很久。这边文章主要介绍一些经典的排序算法,由于博主现在做 web 前端方面的工作,所以编程语言就使用 JavaScript 了。不过,如果是学其他语言的人,读懂大致的思路是没问题的,完全可以仿照文章中 JavaScript 版的代码进行重写。概述排序算法是非常基础的算法之一,在...
2020-05-05 12:37:43
350
原创 算法系列之回溯算法
回溯法简介回溯法(Backtrack)其实是基于递归来实现的。但是它的思考逻辑很有意思,和走迷宫一样。比如我们走到一个分叉口,我们不知道哪一个路口是正确的,但是我们可以先随便选择一个路口。如果最后走不通,我们可以原地返回,在之前的分叉口重新抉择。正是因为这种回溯的思考方式,所以这种算法称之为回溯法。笼统地讲,回溯算法很多时候都应用在“搜索”这类问题上。不过这里说的搜索,并不是狭义的指我们前...
2020-05-03 23:34:04
876
原创 算法系列之哈希表
相信刷过leetcode的同学都对“两数之和”、“三数之和”以及“四数之和”的问题有所印象,因为力扣的第一题就是两数之和。注意:本文所有的代码都采用 JavaScript。所有题目来自 leetcode。两数之和我们先来看一看题目:给定一个整数数组 nums 和一个目标值 target,请你在该数组中找出和为目标值的那 两个 整数,并返回他们的数组下标。你可以假设每种输入只会对应一个答案...
2020-05-02 00:48:27
731
原创 WebApp 首屏优化
背景在进行webapp开发时,如果使用vue或者react类似的框架,并且采用的单页应用的模式,那首屏加载肯定会遇到白屏时间过长的问题。如果我们只是自己写个demo,那么等待一会没有任何关系。但是如果是一个商业应用,那你可能会因此流失一批客户。一般来说如果3秒钟,网页没有打开,20%的新用户会直接离开。剩下的会进行刷新操作,如果还是没有打开,60%的新用户会离开。其实这个时候你的应用曝光的机...
2020-04-30 22:35:32
478
原创 Hybrid App 开发浅谈
缘起智能手机兴起,移动端开发火热起来。起初只有Android和IOS应用,随着H5的问世,以及手机性能的提升,Web App开始斩露头角。一份代码,多端运行。这预示着开发成本的降低,同时也能减少因开发者实现的差异导致Android和IOS应用出现不同的表示。发展如果某一块的功能简单,仅仅是一些页面的展示,那么无用质疑,使用Web App技术现实更优,通过WebView嵌入到原生应用中。...
2019-11-16 20:38:53
503
原创 CSS 深入 3D 动画
Web 技术飞速发展,但是绝大数技术人员并没有跟上其脚步,博主就是其中一员。当我们还在琢磨上一代技术时,那些技术前沿的弄潮儿开始打造新一代技术。这里聊一聊非高频却十分炫酷的 3D 技术,使用 CSS3 即可实现。二维与三维在说到三维之前,我们先聊一聊二维。二维很好理解,即平面。我们使用 x 轴和 y 轴就可以轻松表示。三维是在二维的基础上增加了一个维度。这个稍微有点难理解,可以参考下图:...
2019-08-18 23:50:49
276
原创 一文搞懂 Cordova 开发
古人有云“活到老,学到老”。果不其然,在学校里我们一直在学习,步入社会开始工作后学习也不会停止。需求是不断变化的,能够解决问题才是王道。故唯有不断学习新的技能才能不被时代拉下。Cordova简介Cordova 是一款老牌的基于 HTML,CSS 和 JavaScript 的移动端跨平台框架,它的前身是 PhoneGap。后者在被 Adobe 公司收购之后,将其核心剥离出来,移交给了Apach...
2019-08-05 23:28:22
464
原创 CSS 实现块级元素垂直居中
如果是文本,我们可以使用 line-height 将其垂直居中。但如果是块级元素,就不能这么做了。尽管如此,我们还是有很多方法可以将一个块级元素垂直居中。绝对定位2D 转换弹性盒子布局绝对定位如果块级元素高度和宽度已知,利用绝对定位和负边距,就可以实现垂直居中。<div class="container"> <div class="content">...
2019-03-24 00:31:45
2683
原创 深入浅出 TypeScript
什么是 TypeScriptTypeScript 是 JavaScript 类型的超集,它可以编译为纯 JavaScript。TypeScript 可以在任何浏览器、任何计算机和操作系统上运行,并且是开源的。TypeScript 由微软开发,截至到目前,最新的 TypeScript 版本为 3.3。TypeScript = ES6 + TypeTypeScript 用于解决什么问题...
2019-03-09 22:32:30
1849
原创 性能优化之 CDN
CDN 简介CDN 全称是 Content Delivery Network,内容分发网络。尽可能避开互联网上有可能影响数据传输速度和稳定性的瓶颈和环节,使内容传输更快、更稳定。CDN 原理在网络各处放置节点服务器,构成在现有的互联网基础之上的一层智能虚拟网络。CDN 系统能实时的根据网络流量和各节点的连接、负载状况以及到用户的距离和响应时间等综合信息将用户的请求重新导向离用户最近的节点上...
2018-11-17 21:05:23
2511
原创 深入浅出 RequireJS
简介一个复杂的应用,其编程语言也必须要有模块机制,方能更好的组织代码。在前端 js 模块中,RequireJS 是一个非常小巧的 JavaScript 模块载入框架,是 AMD 规范最好的实现者之一。特点异步加载模块当我们引入 js 文件时,不会阻塞浏览器对 html 文档的渲染。按依赖顺序加载我们不用在当心 js 文件的引入顺序,RequireJS 会自动帮我们处理依赖关系。模块依...
2018-10-28 22:49:55
23011
原创 HTTPS 原理及部署
HTTP 和 HTTPS如果你之前了解过计算机网络,那么你一定听说过 HTTP 协议。HTTP 协议的全称为 HyperText Transfer Protocol,即超文本传输协议。HTTP 协议位于 OSI 七层网络模型中的第七层——应用层。Web 服务器上的所有资源的传输都遵守该协议,用户通过浏览器进行资源的查看和下载。RFC 2616 定义了 HTTP 1.1。简单回顾一下 HTT...
2018-10-10 23:49:05
366
原创 Web 兼容性指南
毫无疑问,随着微信的崛起,移动端网页开发又进一步,需求量不断攀升。但是智能手机市场的丰富多彩,百花齐放,导致移动端的网页开发和传统的 PC 端网页开发有所不同。很多人可能正迈向手机端网页开发,但又听说手机端网页开发有着这样或那样的,所以有些忐忑。这里,博主用近年来开发手机端页面的经历,来告诉大家手机端应该注意哪些问题,同时也会讲一讲这些问题产生的原因以及解决的方法。问题清单&amp;amp;amp;lt;met...
2018-09-29 00:06:32
3165
原创 PHP 并发编程基础和实践
随着互联网的普及,网民越来越多,这就会造成随便的一个活动,就有可能面临高并发带来的性能问题。而 PHP 是单进程的,很容易造成性能瓶颈,所以 PHP 的并发编程实践显得格外重要。如果想要真正理解并发,我们需要一些基础的理论知识。进程、线程与协程进程是计算机中程序关于某数据集合上的一次运行活动是系统进行资源分配和调度的基本单位是操作系统结构的基础是一个“执行中的程序”进...
2018-07-26 23:52:10
5234
原创 性能优化之浏览器缓存
谈到前端性能优化,就不得不提浏览器缓存,它是很重要也很常见的一种方式。但是很多同学仅有缓存的意识,对缓存并没有一个比较清晰的认识。浏览器缓存分类HTTP 状态码 200 from memory cache 说明:直接从本地缓存中获取响应特点:最快速、最省流量,因为根本没有向服务器发送请求HTTP 状态码 304 not modified 说明:协商缓存,浏览器在本地没有命中的...
2018-07-20 23:33:01
365
原创 CSS 块级格式化上下文 BFC
BFC 全称是 block formatting context,翻译成中文就是块级格式化上下文。在很多 CSS 教程中,很少有直接提到 BFC 的。那这是不是说明 BFC 不重要呢?其实不是的,BFC 在有些地方有着很大的作用。
2018-06-03 17:53:29
364
原创 CSS 三栏布局
三栏布局算是网页中最常见的布局之一了。尤其以内容为主的网站,比如优快云、淘宝等。基本都是两侧固定宽度,中间自适应。如果现在让你去实现这么一个三栏布局,你会怎么做呢?利用绝对定位我觉得这是比较古老和容易想到的方式。当初上大学刚接触 CSS 的时候,看到过一个网页,整站都是用绝对定位布局的。当时,觉得理所当然,布局就该这么做…效果如下代码如下&amp;lt;div c...
2018-05-16 00:02:58
4255
原创 CSS 负边距
老实说,个人从来没有重视过 CSS,觉得很简单,没有可学之处。但随着使用和认识的深入,才发现 CSS 也博大精深。加上 CSS3 的出现,以前需要 JavaScript 的地方,现在用 CSS 亦可以轻松实现。相信未来,CSS 一定能大放异彩!这次一起和大家聊一聊 CSS 中的负边距。负边距的特点在正式介绍负边距之前,我们先回顾一下文档流。所谓的文档流,指的是元素排版布局过程中,元...
2018-05-04 00:27:23
2516
原创 Web 防盗链
什么是防盗链防止别人盗用自己服务器资源,如图片、音乐以及视频。一般是小站盗用大站。防盗链工作原理通过referer或者签名,服务器可以检测请求的来源网页,如果是资源文件,则可以跟踪到显示它的网页地址。一旦检测到来源不是本站,则进行阻止。怎么防盗链referer方式Nginx 模块 ngx_http_referer_module 用于阻挡来源非法的域名请求,Ngi...
2018-04-09 23:27:53
1638
原创 PHP 发展史
就像搞对象一样,如果你想要快速的追到对方,前提是你一定要了解对方的过去种种,这样方能得心应手。请吃饭,不会没胃口;送礼物,不会没感觉;聊天时,不会没话题……编程一样,工欲善其事必先利其器。假使你和我一样,都是一个 PHP 程序员,那你的武器便是 PHP。倘若你要使用好这把武器,了解它的前世今生必不可少。知道了它的历史,便能更准确的知道它的定位、优势以及劣势。问世1994年,拉斯...
2018-04-03 23:23:04
3162
原创 JavaScript 模块化介绍
js 是一种脚本语言,与 PHP 类似。但是如今 PHP 不再仅仅构建一个简单的web 系统,它也在向 Java 看齐,也能够支撑起一个庞大的 web 系统。国外非常有名的脸书网就是一个典型的例子。一门语言,要构建出庞大复杂的系统的基础之一就是语言文件的相互引用。毕竟一个单文件直接实现一个庞大复杂的系统是十分吃力的。后端模块化CommonJs在互联网早期,JavaScript 一直在前端发光发热,但在后端基本上没有什么建树。并且 JavaScript 官方的一些规范也仅仅只是对于前端做了很多要求,.
2018-03-26 22:55:46
518
原创 SQL 注入攻防入门
简介所谓 SQL 注入,就是通过把 SQL 命令插入到Web表单提交或页面请求的查询字符串,最终达到欺骗服务器执行恶意的 SQL 命令。原理用户的输入被当成了程序的一部分。 本来希望用户输入 password 为1,但是用户却输入了1 or 1=1。这样,导致错误的密码也可以查询出结果。SQL 注入的产生原因:不当的类型处理不安全的数据库配置不合理的查询集处理...
2018-02-04 22:51:36
315
原创 Web 传输安全
一个 web 请求从浏览器到 web 服务器的过程中,会经过许多的网络节点。每一个网络节点都有能力窃听和篡改 http 请求的内容,所以通过 http 进行的传输是不安全的。危害Http 窃听的危害:窃听用户密码窃听传输的敏感信息非法获取个人资料Http 篡改的危害:插入广告(著名的运营商劫持问题)重定向网站:将目标网站重定向到广告网站或其他危险网站无
2018-01-14 17:20:13
4010
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人
RSS订阅