選型背后的思考：為什么選擇Next.js + FastAPI + LangChain)
技術(shù)選型背后的思考為什么選擇Next.js FastAPI LangChain前言技術(shù)選型是項(xiàng)目成敗的關(guān)鍵。本文將深入分析我們?cè)跇?gòu)建AI Agent框架時(shí)的技術(shù)選型思路以及每個(gè)技術(shù)棧的優(yōu)劣對(duì)比。適合讀者技術(shù)Leader、架構(gòu)師、全棧開(kāi)發(fā)者一、技術(shù)選型的核心原則1.1 選型標(biāo)準(zhǔn)? 成熟度 - 生產(chǎn)環(huán)境驗(yàn)證 ? 社區(qū)活躍度 - 問(wèn)題能快速解決 ? 性能 - 滿足業(yè)務(wù)需求 ? 學(xué)習(xí)曲線 - 團(tuán)隊(duì)能快速上手 ? 生態(tài)完整性 - 周邊工具豐富1.2 避免的陷阱? 盲目追新 - 選擇不成熟的技術(shù) ? 過(guò)度設(shè)計(jì) - 使用過(guò)于復(fù)雜的方案 ? 技術(shù)債務(wù) - 選擇即將淘汰的技術(shù) ? 供應(yīng)商鎖定 - 過(guò)度依賴某一廠商二、Frontend為什么選擇Next.js2.1 候選方案對(duì)比框架優(yōu)勢(shì)劣勢(shì)評(píng)分Next.jsSSR/SSG、優(yōu)秀DX、生態(tài)完整學(xué)習(xí)曲線稍陡?????Create React App簡(jiǎn)單易用無(wú)SSR、配置受限???Vue.js Nuxt簡(jiǎn)單易學(xué)生態(tài)不如React????Angular企業(yè)級(jí)完整方案學(xué)習(xí)曲線陡峭???Svelte性能優(yōu)秀生態(tài)較小???2.2 Next.js的核心優(yōu)勢(shì)1. 服務(wù)端渲染SSR// pages/chat/[id].tsxexportasyncfunctiongetServerSideProps(context){const{id}context.params;// 服務(wù)端獲取數(shù)據(jù)constconversationawaitfetchConversation(id);return{props:{conversation}};}// 優(yōu)勢(shì)// ? SEO友好// ? 首屏加載快// ? 更好的用戶體驗(yàn)2. 文件系統(tǒng)路由pages/ ├── index.tsx → / ├── login.tsx → /login ├── register.tsx → /register └── chat/ ├── index.tsx → /chat └── [id].tsx → /chat/:id // 優(yōu)勢(shì) // ? 無(wú)需配置路由 // ? 代碼組織清晰 // ? 動(dòng)態(tài)路由支持3. API Routes// pages/api/health.tsexportdefaultfunctionhandler(req,res){res.status(200).json({status:ok});}// 優(yōu)勢(shì)// ? 前后端一體化// ? 無(wú)需單獨(dú)部署API// ? 適合BFF模式4. 優(yōu)秀的開(kāi)發(fā)體驗(yàn)# 熱更新npmrun dev# 修改代碼即時(shí)生效# TypeScript支持# 自動(dòng)類型推導(dǎo)、智能提示# 優(yōu)勢(shì)# ? 開(kāi)發(fā)效率高# ? 類型安全# ? 錯(cuò)誤提示友好2.3 實(shí)際應(yīng)用示例// app/chat/page.tsxuse clientimport{useState,useEffect}fromreactimport{useRouter}fromnext/navigationimport{sendMessageStream}from/services/chatexportdefaultfunctionChatPage(){constrouteruseRouter()const[messages,setMessages]useState([])const[inputValue,setInputValue]useState()consthandleSendasync(){letassistantMessageawaitsendMessageStream(conversationId,inputValue,(token){// 實(shí)時(shí)接收TokenassistantMessagetokensetMessages(prev[...prev,{role:assistant,content:assistantMessage}])},(){// 完成console.log(Done)})}return(div classNameflex h-screen{/* Chat UI */}/div)}三、CSS框架為什么選擇TailwindCSS3.1 候選方案對(duì)比方案優(yōu)勢(shì)劣勢(shì)評(píng)分TailwindCSS原子化、高效、可定制HTML冗長(zhǎng)?????CSS Modules作用域隔離需要寫(xiě)CSS????Styled ComponentsCSS-in-JS性能開(kāi)銷???Bootstrap組件豐富樣式雷同???3.2 TailwindCSS的優(yōu)勢(shì)1. 原子化CSS// 傳統(tǒng)CSS div classNamechat-message div classNameavatar/div div classNamecontent/div /div // TailwindCSS div classNameflex space-x-3 p-4 bg-white rounded-lg shadow div classNamew-8 h-8 bg-blue-500 rounded-full/div div classNameflex-1 text-sm text-gray-700/div /div // 優(yōu)勢(shì) // ? 無(wú)需命名class // ? 樣式即文檔 // ? 無(wú)CSS文件2. 響應(yīng)式設(shè)計(jì)div className w-full /* 移動(dòng)端全寬 */ md:w-1/2 /* 平板半寬 */ lg:w-1/3 /* 桌面1/3寬 */ p-4 /* 內(nèi)邊距 */ md:p-6 /* 平板更大內(nèi)邊距 */ 響應(yīng)式內(nèi)容 /div3. 暗黑模式div className bg-white dark:bg-gray-800 text-gray-900 dark:text-gray-100 自動(dòng)適配暗黑模式 /div四、Backend為什么選擇FastAPI4.1 候選方案對(duì)比框架優(yōu)勢(shì)劣勢(shì)評(píng)分FastAPI高性能、異步、自動(dòng)文檔相對(duì)年輕?????Django功能完整、ORM強(qiáng)大同步、笨重????Flask輕量靈活需要自己組裝???Express.js生態(tài)豐富需要TypeScript????4.2 FastAPI的核心優(yōu)勢(shì)1. 高性能異步fromfastapiimportFastAPIimporthttpx appFastAPI()app.get(/users/{user_id})asyncdefget_user(user_id:int):# 異步HTTP請(qǐng)求asyncwithhttpx.AsyncClient()asclient:responseawaitclient.get(fhttps://api.example.com/users/{user_id})returnresponse.json()# 性能對(duì)比# FastAPI (異步): 10000 QPS# Flask (同步): 1000 QPS# Django (同步): 500 QPS2. 自動(dòng)API文檔frompydanticimportBaseModelclassUser(BaseModel):id:intusername:stremail:strapp.post(/users,response_modelUser)asyncdefcreate_user(user:User):創(chuàng)建用戶returnuser# 自動(dòng)生成# - Swagger UI: http://localhost:8000/docs# - ReDoc: http://localhost:8000/redoc# - OpenAPI Schema: http://localhost:8000/openapi.json3. 類型驗(yàn)證frompydanticimportBaseModel,EmailStr,validatorclassUserCreate(BaseModel):username:stremail:EmailStr password:strvalidator(password)defpassword_strength(cls,v):iflen(v)8:raiseValueError(密碼至少8位)returnvapp.post(/register)asyncdefregister(user:UserCreate):# 自動(dòng)驗(yàn)證# ? username必須是字符串# ? email必須是有效郵箱# ? password至少8位return{msg:注冊(cè)成功}4. 依賴注入fromfastapiimportDependsfromsqlalchemy.ext.asyncioimportAsyncSessionasyncdefget_db()-AsyncSession:數(shù)據(jù)庫(kù)會(huì)話依賴asyncwithasync_session()assession:yieldsessionapp.get(/users)asyncdefget_users(db:AsyncSessionDepends(get_db)):# 自動(dòng)注入數(shù)據(jù)庫(kù)會(huì)話resultawaitdb.execute(select(User))returnresult.scalars().all()4.3 SSE流式支持fromfastapi.responsesimportStreamingResponseimportasyncioapp.get(/stream)asyncdefstream():asyncdefevent_generator():foriinrange(10):yieldfdata:{i}\n\nawaitasyncio.sleep(1)returnStreamingResponse(event_generator(),media_typetext/event-stream)# 優(yōu)勢(shì)# ? 原生支持SSE# ? 異步生成器# ? 低延遲五、Database為什么選擇PostgreSQL5.1 候選方案對(duì)比數(shù)據(jù)庫(kù)優(yōu)勢(shì)劣勢(shì)評(píng)分PostgreSQL功能強(qiáng)大、ACID、擴(kuò)展性配置稍復(fù)雜?????MySQL簡(jiǎn)單易用、生態(tài)好功能相對(duì)弱????MongoDB靈活Schema無(wú)事務(wù)支持???SQLite零配置不適合生產(chǎn)??5.2 PostgreSQL的優(yōu)勢(shì)1. 強(qiáng)大的數(shù)據(jù)類型-- JSON類型CREATETABLEconversations(idSERIALPRIMARYKEY,metadata JSONB-- 支持JSON查詢和索引);-- 數(shù)組類型CREATETABLEusers(idSERIALPRIMARYKEY,tagsTEXT[]-- 字符串?dāng)?shù)組);-- 全文搜索CREATEINDEXidx_contentONmessagesUSINGgin(to_tsvector(chinese,content));2. 事務(wù)支持asyncwithdb.begin():# 創(chuàng)建對(duì)話conversationConversation(title新對(duì)話)db.add(conversation)awaitdb.flush()# 創(chuàng)建消息messageMessage(conversation_idconversation.id,content你好)db.add(message)# 自動(dòng)提交或回滾3. 擴(kuò)展性-- 安裝向量擴(kuò)展CREATEEXTENSION vector;-- 存儲(chǔ)向量數(shù)據(jù)CREATETABLEembeddings(idSERIALPRIMARYKEY,vector vector(1536)-- 1536維向量);-- 向量相似度搜索SELECT*FROMembeddingsORDERBYvector-[0.1, 0.2, ...]LIMIT5;六、AI框架為什么選擇LangChain6.1 候選方案對(duì)比框架優(yōu)勢(shì)劣勢(shì)評(píng)分LangChain生態(tài)完整、RAG支持抽象層多?????LlamaIndex專注RAG功能單一????Haystack企業(yè)級(jí)學(xué)習(xí)曲線陡???自研完全可控開(kāi)發(fā)成本高??6.2 LangChain的核心優(yōu)勢(shì)1. 完整的RAG工具鏈fromlangchain_community.vectorstoresimportWeaviatefromlangchain_community.embeddingsimportOllamaEmbeddingsfromlangchain_community.llmsimportOllamafromlangchain.chainsimportRetrievalQA# 1. Embedding模型embeddingsOllamaEmbeddings(modelnomic-embed-text)# 2. 向量數(shù)據(jù)庫(kù)vectorstoreWeaviate(clientclient,embeddingembeddings)# 3. LLMllmOllama(modelllama3.2:latest)# 4. RAG鏈qa_chainRetrievalQA.from_chain_type(llmllm,retrievervectorstore.as_retriever(search_kwargs{k:5}))# 5. 問(wèn)答answerqa_chain.run(如何重置密碼)2. LCELLangChain Expression Languagefromlangchain.promptsimportPromptTemplatefromlangchain.schema.output_parserimportStrOutputParser# 構(gòu)建鏈chain({context:retriever,question:lambdax:x}|prompt|llm|StrOutputParser())# 流式執(zhí)行asyncforchunkinchain.astream(你好):print(chunk,end)3. 豐富的集成# 支持100種集成fromlangchain_community.llmsimport(Ollama,# 本地模型OpenAI,# OpenAIAnthropic,# ClaudeHuggingFace,# HuggingFace)fromlangchain_community.vectorstoresimport(Weaviate,# WeaviateChroma,# ChromaPinecone,# PineconeFAISS,# FAISS)七、LLM為什么選擇Ollama7.1 候選方案對(duì)比方案優(yōu)勢(shì)劣勢(shì)評(píng)分Ollama本地部署、零成本需要GPU?????OpenAI API效果好、穩(wěn)定成本高、數(shù)據(jù)上傳????HuggingFace模型豐富需要自己部署???vLLM高性能配置復(fù)雜???7.2 Ollama的優(yōu)勢(shì)1. 一鍵部署# 安裝Ollamacurl-fsSLhttps://ollama.ai/install.sh|sh# 下載模型ollama pull llama3.2:latest ollama pull nomic-embed-text# 啟動(dòng)服務(wù)ollama serve# http://localhost:114342. 簡(jiǎn)單的APIfromlangchain_community.llmsimportOllama llmOllama(modelllama3.2:latest,base_urlhttp://localhost:11434,temperature0.7)# 同步調(diào)用responsellm.invoke(你好)# 異步流式asyncforchunkinllm.astream(講個(gè)笑話):print(chunk,end)3. 本地化優(yōu)勢(shì)? 數(shù)據(jù)隱私 - 數(shù)據(jù)不出本地 ? 零成本 - 無(wú)API調(diào)用費(fèi)用 ? 低延遲 - 本地推理更快 ? 可定制 - 可微調(diào)模型 ? 離線可用 - 不依賴網(wǎng)絡(luò)八、向量數(shù)據(jù)庫(kù)為什么選擇Weaviate8.1 候選方案對(duì)比數(shù)據(jù)庫(kù)優(yōu)勢(shì)劣勢(shì)評(píng)分Weaviate功能完整、性能好資源占用高?????Chroma輕量、易用功能較少????Pinecone云端托管收費(fèi)、數(shù)據(jù)上傳???FAISS高性能無(wú)持久化???8.2 Weaviate的優(yōu)勢(shì)1. 混合搜索# 向量搜索 關(guān)鍵詞搜索resultsvectorstore.similarity_search(query重置密碼,search_typehybrid,# 混合搜索k5)2. 多租戶支持# 為每個(gè)用戶創(chuàng)建獨(dú)立的CollectionvectorstoreWeaviate(clientclient,index_namefUser_{user_id}_Docs)3. GraphQL查詢{ Get { ServiceTicket( nearText: { concepts: [重置密碼] } limit: 5 ) { title description _additional { distance } } } }九、技術(shù)?？傆[┌─────────────────────────────────────────┐ │ Frontend Stack │ │ Next.js 13 React 18 TypeScript │ │ TailwindCSS Axios SSE │ └────────────┬────────────────────────────┘ │ ┌────────────▼────────────────────────────┐ │ Backend Stack │ │ FastAPI SQLAlchemy 2.0 Pydantic │ │ PostgreSQL Redis JWT │ └────────────┬────────────────────────────┘ │ ┌────────────▼────────────────────────────┐ │ AI Stack │ │ LangChain Ollama Weaviate │ │ Pandas llama3.2 nomic-embed-text │ └─────────────────────────────────────────┘十、成本對(duì)比10.1 本地部署 vs 云端API項(xiàng)目本地部署云端API初始成本服務(wù)器$2000$0月度成本電費(fèi)$50API費(fèi)用$500年度成本$600$60003年總成本$2600$1800010.2 ROI分析本地部署回本周期4-5個(gè)月 3年節(jié)省成本$15000十一、踩坑經(jīng)驗(yàn)11.1 Next.js部署?錯(cuò)誤使用next export導(dǎo)出靜態(tài)站點(diǎn)問(wèn)題無(wú)法使用API Routes和SSR?正確使用next start或部署到Vercel11.2 FastAPI異步?錯(cuò)誤在異步函數(shù)中使用同步數(shù)據(jù)庫(kù)操作app.get(/users)asyncdefget_users():usersdb.query(User).all()# ? 阻塞returnusers?正確使用異步ORMapp.get(/users)asyncdefget_users(db:AsyncSessionDepends(get_db)):resultawaitdb.execute(select(User))# ? 異步returnresult.scalars().all()11.3 Ollama顯存?錯(cuò)誤同時(shí)加載多個(gè)大模型問(wèn)題顯存不足?正確按需加載及時(shí)釋放# 查看已加載模型ollamaps# 卸載模型ollama stop llama3.2:latest十二、總結(jié)技術(shù)選型的核心思路?成熟穩(wěn)定- 選擇經(jīng)過(guò)生產(chǎn)驗(yàn)證的技術(shù)?性能優(yōu)先- 滿足業(yè)務(wù)性能需求?生態(tài)完整- 周邊工具和社區(qū)支持?成本可控- 考慮長(zhǎng)期TCO?團(tuán)隊(duì)匹配- 符合團(tuán)隊(duì)技術(shù)棧下一篇預(yù)告《SSE vs WebSocket實(shí)時(shí)AI對(duì)話的最佳實(shí)踐》作者簡(jiǎn)介資深開(kāi)發(fā)者創(chuàng)業(yè)者。專注于視頻通訊技術(shù)領(lǐng)域。國(guó)內(nèi)首本Flutter著作《Flutter技術(shù)入門與實(shí)戰(zhàn)》作者,另著有《Dart語(yǔ)言實(shí)戰(zhàn)》及《WebRTC音視頻開(kāi)發(fā)》等書(shū)籍。多年從事視頻會(huì)議、遠(yuǎn)程教育等技術(shù)研發(fā)對(duì)于Android、iOS以及跨平臺(tái)開(kāi)發(fā)技術(shù)有比較深入的研究和應(yīng)用作為主要程序員開(kāi)發(fā)了多個(gè)應(yīng)用項(xiàng)目涉及醫(yī)療、交通、銀行等領(lǐng)域。學(xué)習(xí)資料項(xiàng)目地址作者GitHub歡迎交流如有問(wèn)題歡迎在評(píng)論區(qū)討論 03-技術(shù)選型背后的思考：為什么選擇Next.js + FastAPI + LangChain
技術(shù)選型背后的思考為什么選擇Next.js FastAPI LangChain前言技術(shù)選型是項(xiàng)目成敗的關(guān)鍵。本文將深入分析我們?cè)跇?gòu)建AI Agent框架時(shí)的技術(shù)選型思路以及每個(gè)技術(shù)棧的優(yōu)劣對(duì)比。適合讀者技術(shù)Leader、架構(gòu)師、全棧開(kāi)發(fā)者一、技術(shù)選型的核心原則1.1 選型標(biāo)準(zhǔn)? 成熟度 - 生產(chǎn)環(huán)境驗(yàn)證 ? 社區(qū)活躍度 - 問(wèn)題能快速解決 ? 性能 - 滿足業(yè)務(wù)需求 ? 學(xué)習(xí)曲線 - 團(tuán)隊(duì)能快速上手 ? 生態(tài)完整性 - 周邊工具豐富1.2 避免的陷阱? 盲目追新 - 選擇不成熟的技術(shù) ? 過(guò)度設(shè)計(jì) - 使用過(guò)于復(fù)雜的方案 ? 技術(shù)債務(wù) - 選擇即將淘汰的技術(shù) ? 供應(yīng)商鎖定 - 過(guò)度依賴某一廠商二、Frontend為什么選擇Next.js2.1 候選方案對(duì)比框架優(yōu)勢(shì)劣勢(shì)評(píng)分Next.jsSSR/SSG、優(yōu)秀DX、生態(tài)完整學(xué)習(xí)曲線稍陡?????Create React App簡(jiǎn)單易用無(wú)SSR、配置受限???Vue.js Nuxt簡(jiǎn)單易學(xué)生態(tài)不如React????Angular企業(yè)級(jí)完整方案學(xué)習(xí)曲線陡峭???Svelte性能優(yōu)秀生態(tài)較小???2.2 Next.js的核心優(yōu)勢(shì)1. 服務(wù)端渲染SSR// pages/chat/[id].tsxexportasyncfunctiongetServerSideProps(context){const{id}context.params;// 服務(wù)端獲取數(shù)據(jù)constconversationawaitfetchConversation(id);return{props:{conversation}};}// 優(yōu)勢(shì)// ? SEO友好// ? 首屏加載快// ? 更好的用戶體驗(yàn)2. 文件系統(tǒng)路由pages/ ├── index.tsx → / ├── login.tsx → /login ├── register.tsx → /register └── chat/ ├── index.tsx → /chat └── [id].tsx → /chat/:id // 優(yōu)勢(shì) // ? 無(wú)需配置路由 // ? 代碼組織清晰 // ? 動(dòng)態(tài)路由支持3. API Routes// pages/api/health.tsexportdefaultfunctionhandler(req,res){res.status(200).json({status:ok});}// 優(yōu)勢(shì)// ? 前后端一體化// ? 無(wú)需單獨(dú)部署API// ? 適合BFF模式4. 優(yōu)秀的開(kāi)發(fā)體驗(yàn)# 熱更新npmrun dev# 修改代碼即時(shí)生效# TypeScript支持# 自動(dòng)類型推導(dǎo)、智能提示# 優(yōu)勢(shì)# ? 開(kāi)發(fā)效率高# ? 類型安全# ? 錯(cuò)誤提示友好2.3 實(shí)際應(yīng)用示例// app/chat/page.tsxuse clientimport{useState,useEffect}fromreactimport{useRouter}fromnext/navigationimport{sendMessageStream}from/services/chatexportdefaultfunctionChatPage(){constrouteruseRouter()const[messages,setMessages]useState([])const[inputValue,setInputValue]useState()consthandleSendasync(){letassistantMessageawaitsendMessageStream(conversationId,inputValue,(token){// 實(shí)時(shí)接收TokenassistantMessagetokensetMessages(prev[...prev,{role:assistant,content:assistantMessage}])},(){// 完成console.log(Done)})}return(div classNameflex h-screen{/* Chat UI */}/div)}三、CSS框架為什么選擇TailwindCSS3.1 候選方案對(duì)比方案優(yōu)勢(shì)劣勢(shì)評(píng)分TailwindCSS原子化、高效、可定制HTML冗長(zhǎng)?????CSS Modules作用域隔離需要寫(xiě)CSS????Styled ComponentsCSS-in-JS性能開(kāi)銷???Bootstrap組件豐富樣式雷同???3.2 TailwindCSS的優(yōu)勢(shì)1. 原子化CSS// 傳統(tǒng)CSS div classNamechat-message div classNameavatar/div div classNamecontent/div /div // TailwindCSS div classNameflex space-x-3 p-4 bg-white rounded-lg shadow div classNamew-8 h-8 bg-blue-500 rounded-full/div div classNameflex-1 text-sm text-gray-700/div /div // 優(yōu)勢(shì) // ? 無(wú)需命名class // ? 樣式即文檔 // ? 無(wú)CSS文件2. 響應(yīng)式設(shè)計(jì)div className w-full /* 移動(dòng)端全寬 */ md:w-1/2 /* 平板半寬 */ lg:w-1/3 /* 桌面1/3寬 */ p-4 /* 內(nèi)邊距 */ md:p-6 /* 平板更大內(nèi)邊距 */ 響應(yīng)式內(nèi)容 /div3. 暗黑模式div className bg-white dark:bg-gray-800 text-gray-900 dark:text-gray-100 自動(dòng)適配暗黑模式 /div四、Backend為什么選擇FastAPI4.1 候選方案對(duì)比框架優(yōu)勢(shì)劣勢(shì)評(píng)分FastAPI高性能、異步、自動(dòng)文檔相對(duì)年輕?????Django功能完整、ORM強(qiáng)大同步、笨重????Flask輕量靈活需要自己組裝???Express.js生態(tài)豐富需要TypeScript????4.2 FastAPI的核心優(yōu)勢(shì)1. 高性能異步fromfastapiimportFastAPIimporthttpx appFastAPI()app.get(/users/{user_id})asyncdefget_user(user_id:int):# 異步HTTP請(qǐng)求asyncwithhttpx.AsyncClient()asclient:responseawaitclient.get(fhttps://api.example.com/users/{user_id})returnresponse.json()# 性能對(duì)比# FastAPI (異步): 10000 QPS# Flask (同步): 1000 QPS# Django (同步): 500 QPS2. 自動(dòng)API文檔frompydanticimportBaseModelclassUser(BaseModel):id:intusername:stremail:strapp.post(/users,response_modelUser)asyncdefcreate_user(user:User):創(chuàng)建用戶returnuser# 自動(dòng)生成# - Swagger UI: http://localhost:8000/docs# - ReDoc: http://localhost:8000/redoc# - OpenAPI Schema: http://localhost:8000/openapi.json3. 類型驗(yàn)證frompydanticimportBaseModel,EmailStr,validatorclassUserCreate(BaseModel):username:stremail:EmailStr password:strvalidator(password)defpassword_strength(cls,v):iflen(v)8:raiseValueError(密碼至少8位)returnvapp.post(/register)asyncdefregister(user:UserCreate):# 自動(dòng)驗(yàn)證# ? username必須是字符串# ? email必須是有效郵箱# ? password至少8位return{msg:注冊(cè)成功}4. 依賴注入fromfastapiimportDependsfromsqlalchemy.ext.asyncioimportAsyncSessionasyncdefget_db()-AsyncSession:數(shù)據(jù)庫(kù)會(huì)話依賴asyncwithasync_session()assession:yieldsessionapp.get(/users)asyncdefget_users(db:AsyncSessionDepends(get_db)):# 自動(dòng)注入數(shù)據(jù)庫(kù)會(huì)話resultawaitdb.execute(select(User))returnresult.scalars().all()4.3 SSE流式支持fromfastapi.responsesimportStreamingResponseimportasyncioapp.get(/stream)asyncdefstream():asyncdefevent_generator():foriinrange(10):yieldfdata:{i}\n\nawaitasyncio.sleep(1)returnStreamingResponse(event_generator(),media_typetext/event-stream)# 優(yōu)勢(shì)# ? 原生支持SSE# ? 異步生成器# ? 低延遲五、Database為什么選擇PostgreSQL5.1 候選方案對(duì)比數(shù)據(jù)庫(kù)優(yōu)勢(shì)劣勢(shì)評(píng)分PostgreSQL功能強(qiáng)大、ACID、擴(kuò)展性配置稍復(fù)雜?????MySQL簡(jiǎn)單易用、生態(tài)好功能相對(duì)弱????MongoDB靈活Schema無(wú)事務(wù)支持???SQLite零配置不適合生產(chǎn)??5.2 PostgreSQL的優(yōu)勢(shì)1. 強(qiáng)大的數(shù)據(jù)類型-- JSON類型CREATETABLEconversations(idSERIALPRIMARYKEY,metadata JSONB-- 支持JSON查詢和索引);-- 數(shù)組類型CREATETABLEusers(idSERIALPRIMARYKEY,tagsTEXT[]-- 字符串?dāng)?shù)組);-- 全文搜索CREATEINDEXidx_contentONmessagesUSINGgin(to_tsvector(chinese,content));2. 事務(wù)支持asyncwithdb.begin():# 創(chuàng)建對(duì)話conversationConversation(title新對(duì)話)db.add(conversation)awaitdb.flush()# 創(chuàng)建消息messageMessage(conversation_idconversation.id,content你好)db.add(message)# 自動(dòng)提交或回滾3. 擴(kuò)展性-- 安裝向量擴(kuò)展CREATEEXTENSION vector;-- 存儲(chǔ)向量數(shù)據(jù)CREATETABLEembeddings(idSERIALPRIMARYKEY,vector vector(1536)-- 1536維向量);-- 向量相似度搜索SELECT*FROMembeddingsORDERBYvector-[0.1, 0.2, ...]LIMIT5;六、AI框架為什么選擇LangChain6.1 候選方案對(duì)比框架優(yōu)勢(shì)劣勢(shì)評(píng)分LangChain生態(tài)完整、RAG支持抽象層多?????LlamaIndex專注RAG功能單一????Haystack企業(yè)級(jí)學(xué)習(xí)曲線陡???自研完全可控開(kāi)發(fā)成本高??6.2 LangChain的核心優(yōu)勢(shì)1. 完整的RAG工具鏈fromlangchain_community.vectorstoresimportWeaviatefromlangchain_community.embeddingsimportOllamaEmbeddingsfromlangchain_community.llmsimportOllamafromlangchain.chainsimportRetrievalQA# 1. Embedding模型embeddingsOllamaEmbeddings(modelnomic-embed-text)# 2. 向量數(shù)據(jù)庫(kù)vectorstoreWeaviate(clientclient,embeddingembeddings)# 3. LLMllmOllama(modelllama3.2:latest)# 4. RAG鏈qa_chainRetrievalQA.from_chain_type(llmllm,retrievervectorstore.as_retriever(search_kwargs{k:5}))# 5. 問(wèn)答answerqa_chain.run(如何重置密碼)2. LCELLangChain Expression Languagefromlangchain.promptsimportPromptTemplatefromlangchain.schema.output_parserimportStrOutputParser# 構(gòu)建鏈chain({context:retriever,question:lambdax:x}|prompt|llm|StrOutputParser())# 流式執(zhí)行asyncforchunkinchain.astream(你好):print(chunk,end)3. 豐富的集成# 支持100種集成fromlangchain_community.llmsimport(Ollama,# 本地模型OpenAI,# OpenAIAnthropic,# ClaudeHuggingFace,# HuggingFace)fromlangchain_community.vectorstoresimport(Weaviate,# WeaviateChroma,# ChromaPinecone,# PineconeFAISS,# FAISS)七、LLM為什么選擇Ollama7.1 候選方案對(duì)比方案優(yōu)勢(shì)劣勢(shì)評(píng)分Ollama本地部署、零成本需要GPU?????OpenAI API效果好、穩(wěn)定成本高、數(shù)據(jù)上傳????HuggingFace模型豐富需要自己部署???vLLM高性能配置復(fù)雜???7.2 Ollama的優(yōu)勢(shì)1. 一鍵部署# 安裝Ollamacurl-fsSLhttps://ollama.ai/install.sh|sh# 下載模型ollama pull llama3.2:latest ollama pull nomic-embed-text# 啟動(dòng)服務(wù)ollama serve# http://localhost:114342. 簡(jiǎn)單的APIfromlangchain_community.llmsimportOllama llmOllama(modelllama3.2:latest,base_urlhttp://localhost:11434,temperature0.7)# 同步調(diào)用responsellm.invoke(你好)# 異步流式asyncforchunkinllm.astream(講個(gè)笑話):print(chunk,end)3. 本地化優(yōu)勢(shì)? 數(shù)據(jù)隱私 - 數(shù)據(jù)不出本地 ? 零成本 - 無(wú)API調(diào)用費(fèi)用 ? 低延遲 - 本地推理更快 ? 可定制 - 可微調(diào)模型 ? 離線可用 - 不依賴網(wǎng)絡(luò)八、向量數(shù)據(jù)庫(kù)為什么選擇Weaviate8.1 候選方案對(duì)比數(shù)據(jù)庫(kù)優(yōu)勢(shì)劣勢(shì)評(píng)分Weaviate功能完整、性能好資源占用高?????Chroma輕量、易用功能較少????Pinecone云端托管收費(fèi)、數(shù)據(jù)上傳???FAISS高性能無(wú)持久化???8.2 Weaviate的優(yōu)勢(shì)1. 混合搜索# 向量搜索 關(guān)鍵詞搜索resultsvectorstore.similarity_search(query重置密碼,search_typehybrid,# 混合搜索k5)2. 多租戶支持# 為每個(gè)用戶創(chuàng)建獨(dú)立的CollectionvectorstoreWeaviate(clientclient,index_namefUser_{user_id}_Docs)3. GraphQL查詢{ Get { ServiceTicket( nearText: { concepts: [重置密碼] } limit: 5 ) { title description _additional { distance } } } }九、技術(shù)?？傆[┌─────────────────────────────────────────┐ │ Frontend Stack │ │ Next.js 13 React 18 TypeScript │ │ TailwindCSS Axios SSE │ └────────────┬────────────────────────────┘ │ ┌────────────▼────────────────────────────┐ │ Backend Stack │ │ FastAPI SQLAlchemy 2.0 Pydantic │ │ PostgreSQL Redis JWT │ └────────────┬────────────────────────────┘ │ ┌────────────▼────────────────────────────┐ │ AI Stack │ │ LangChain Ollama Weaviate │ │ Pandas llama3.2 nomic-embed-text │ └─────────────────────────────────────────┘十、成本對(duì)比10.1 本地部署 vs 云端API項(xiàng)目本地部署云端API初始成本服務(wù)器$2000$0月度成本電費(fèi)$50API費(fèi)用$500年度成本$600$60003年總成本$2600$1800010.2 ROI分析本地部署回本周期4-5個(gè)月 3年節(jié)省成本$15000十一、踩坑經(jīng)驗(yàn)11.1 Next.js部署?錯(cuò)誤使用next export導(dǎo)出靜態(tài)站點(diǎn)問(wèn)題無(wú)法使用API Routes和SSR?正確使用next start或部署到Vercel11.2 FastAPI異步?錯(cuò)誤在異步函數(shù)中使用同步數(shù)據(jù)庫(kù)操作app.get(/users)asyncdefget_users():usersdb.query(User).all()# ? 阻塞returnusers?正確使用異步ORMapp.get(/users)asyncdefget_users(db:AsyncSessionDepends(get_db)):resultawaitdb.execute(select(User))# ? 異步returnresult.scalars().all()11.3 Ollama顯存?錯(cuò)誤同時(shí)加載多個(gè)大模型問(wèn)題顯存不足?正確按需加載及時(shí)釋放# 查看已加載模型ollamaps# 卸載模型ollama stop llama3.2:latest十二、總結(jié)技術(shù)選型的核心思路?成熟穩(wěn)定- 選擇經(jīng)過(guò)生產(chǎn)驗(yàn)證的技術(shù)?性能優(yōu)先- 滿足業(yè)務(wù)性能需求?生態(tài)完整- 周邊工具和社區(qū)支持?成本可控- 考慮長(zhǎng)期TCO?團(tuán)隊(duì)匹配- 符合團(tuán)隊(duì)技術(shù)棧下一篇預(yù)告《SSE vs WebSocket實(shí)時(shí)AI對(duì)話的最佳實(shí)踐》作者簡(jiǎn)介資深開(kāi)發(fā)者創(chuàng)業(yè)者。專注于視頻通訊技術(shù)領(lǐng)域。國(guó)內(nèi)首本Flutter著作《Flutter技術(shù)入門與實(shí)戰(zhàn)》作者,另著有《Dart語(yǔ)言實(shí)戰(zhàn)》及《WebRTC音視頻開(kāi)發(fā)》等書(shū)籍。多年從事視頻會(huì)議、遠(yuǎn)程教育等技術(shù)研發(fā)對(duì)于Android、iOS以及跨平臺(tái)開(kāi)發(fā)技術(shù)有比較深入的研究和應(yīng)用作為主要程序員開(kāi)發(fā)了多個(gè)應(yīng)用項(xiàng)目涉及醫(yī)療、交通、銀行等領(lǐng)域。學(xué)習(xí)資料項(xiàng)目地址作者GitHub歡迎交流如有問(wèn)題歡迎在評(píng)論區(qū)討論