React + Springboot + Quartz，從0實現Excel報表自動化
一、項目背景 企業日常工作中需要製作大量的報表，比如商品的銷量、銷售額、庫存詳情、員工打卡信息、保險報銷、辦公用品採購、差旅報銷、項目進度等等，都需要製作統計圖表以更直觀地查閲。但是報表的製作往往需要耗費大量的時間，即使複用製作好的報表模版，一次次週期性對數據的複製粘貼操作也很耗人，同時模版在此過程中也會逐漸變得面目全非。 基於此，我們需要挖掘數據背後隱藏的關聯信息，將人工的常規性操作抽離出
葡萄城技術團隊 動態日志
動態
列表
TV 端 APP 界面設計：原則、模式與實用指南（上） | 葡萄城技術團隊
TV 端 APP 界面設計：原則、模式與實用指南（上） UX · 設計 · 電視 · 靈感 電視界面設計是個獨特、有趣卻常被忽視的領域。幾十年來，它在演進與創新中不斷髮展，卻始終受限於自身的傳統遺產。讓我們跟隨米蘭（Milan）的視角，探索那些決定電視操控邏輯的歷史、獨特屬性與不可撼動的規則。 電視已佔據我們的客廳數十年。我們觀看、交互、操控它，卻很少有人專門為它做設計。此前，電視設計也一直不在我
TV 端 APP 界面設計：原則、模式與實用指南（下） | 葡萄城技術團隊
TV 端 APP 界面設計：原則、模式與實用指南（下） 在上篇中，我們詳細解析了電視體驗的底層交互範式，如今是時候進入實踐環節了。在本系列的第二篇文章中，你將探索"10 英尺體驗"的核心構建模塊，以及如何在設計中充分發揮它們的價值。 上篇已梳理了電視的發展歷史與傳統遺產，現在我們聚焦更實際的問題。需要快速回顧的是："10 英尺體驗"及其對遙控器 6 個核心按鈕的依賴，是我們所有設計工作的基礎---
告別 DOM 的舊時代：從零重塑 Web 渲染的未來
引言 瀏覽器這玩意兒現在真夠詭異的。WebAssembly 在服務器端混得風生水起，但客户端還是那副老樣子，跟十年前沒啥區別。 WASM 粉會跟你吹，通過點 JS 膠水代碼就能調原生 Web API。但核心問題是：為啥非得用 DOM？這東西就是個默認選項罷了。本文直擊 DOM 和相關 API 的痛點，為什麼該讓它們退場了，順便腦洞下怎麼改進。 作者不是瀏覽器全棧專家——沒人能全懂了，這正是癥結所在
ES13中11個令人驚歎的 JavaScript 新特性
前言 與許多其他編程語言一樣，JavaScript 也在不斷髮展。每年，該語言都會通過新功能變得更加強大，使開發人員能夠編寫更具表現力和簡潔的代碼。 本葡萄今天就為大家介紹ES13中添加的最新功能，並查看其用法示例以更好地理解它們。 1.類 在ES13之前，類字段只能在構造函數中聲明。與許多其他語言不同，無法在類的最外層作用域中聲明或定義它們。 class Car { constructo
六大緩存（Caching）策略揭秘：延遲與複雜性的完美平衡
引言 在為應用程序添加緩存時，首先需要考慮緩存策略。緩存策略決定了從緩存和底層存儲（如數據庫或服務）進行讀寫操作的方式。 從高層次來看，你需要決定在發生緩存未命中（cache miss）時，緩存是被動還是主動的。也就是説，當應用程序從緩存中查找一個值但該值不存在或已過期時，緩存策略會決定是由應用程序還是緩存本身從底層存儲中獲取數據。不同的緩存策略在延遲和複雜性之間存在不同的權衡，下面我們將逐一探討
文檔：架構師的“編程語言”
高級開發工程師懂得將代碼部署到由代碼構成的系統中，而架構師則懂得將想法部署到由人構成的系統裏。 從初級開發到資深/首席開發，職業路徑通常很清晰：代碼寫得越好，能輔助高效編碼的技術、非技術能力越強，晉升速度就越快。但一旦到了資深級別，職業道路就會出現一個關鍵分叉。 很多開發者會選擇管理崗。這條路徑能大幅提升影響力，幫你在職業階梯上繼續攀升，但缺點也很明顯------你
前端性能優化終極清單：提升你的網站速度與用户體驗
在當今的 Web 生態中，性能即功能。用户期望網站加載瞬間完成，交互無比流暢。搜索引擎（尤其是 Google）也將核心 Web 指標 (Core Web Vitals) 等性能因素作為排名的重要依據。一個緩慢的網站會直接導致用户流失、轉化率下降和品牌形象受損。 這份前端性能檢查清單旨在為你提供一個系統性的框架，幫助你識別、診斷並修復影響網站速度的關鍵瓶頸。它涵蓋了從基礎測量到高級優化的各個
2025 年前端性能優化終極指南
性能本身就是產品的一部分：它會影響 SEO、轉化率、用户留存，甚至用户對品牌的印象。本指南是一份實用的"即拿即用"手冊，幫你在 2025 年打造出明顯更快的應用------而且無需重構現有技術棧。 為什麼性能是核心業務屬性？ 更高轉化率：每 100 毫秒都至關重要。速度越快，用户體驗越好，轉化率也越高。 更優 SEO 排名：核心網頁指標（Core Web Vitals）已是搜索引擎的排名依
React Native 錯誤處理完全指南
React Native 錯誤處理完全指南 深入解析跨平台應用中的 JS 錯誤、原生崩潰及異常監控方案，附實戰代碼與最佳實踐。 在 React Native 跨平台開發中，錯誤處理是保障應用穩定性與用户體驗的核心環節。不同於純 Web 應用或原生應用，React Native 應用的錯誤來源更為複雜——既包含 JavaScript 層的邏輯錯誤，也涉及 iOS/Android 雙端的原生模塊異常，
C# SIMD向量索引實戰：從理論到高性能實現
C# SIMD向量索引實戰：從理論到高性能實現 性能革命的起點 想象這樣一個場景：你正在開發一個智能推薦系統，需要從100萬個商品向量中快速找出與用户查詢最相似的前10個商品。如果引入Qdrant的話會增加部署複雜度、嵌入式的Faiss對.NET生態並不友好，該怎麼辦？ 要不自己構建一個向量索引吧。確保同樣的查詢一樣只需要幾十毫秒，和Faiss性能相當！ 這不是紙上談兵，而是我在實際項目中實現的高
解析Html Canvas的卓越性能與高效渲染策略
一、什麼是Canvas 想必學習前端的同學們對Canvas 都不陌生，它是 HTML5 新增的“畫布”元素，可以使用JavaScript來繪製圖形。 Canvas元素是在HTML5中新增的標籤用於在網頁實時生成圖像，並且可以操作圖像內容，基本上它是一個可以用JavaScript操作的位圖（bitmap）。Canvas 由一個可繪製區域HTML代碼中的屬性定義決定高度和寬度。JavaScript代碼
突破Canvas困境：低成本實現Web端流程圖設計功能之道
最新技術資源（建議收藏） https://www.grapecity.com.cn/resources/ 前言 相信大家在職場中經常會用到流程圖，在互聯網行業，繪製流程圖不論在產品的設計階段，還是後期優化業務流程的階段，都有着巨大的價值。事實上，不僅是互聯網行業，流程圖其實廣泛應用於各行各業。 比如説，銀行在辦理開户業務時，會有一套較為複雜的流程，中間不僅有固定的步驟，如審核材料、打印
最全前端Web報表打印方法彙總
最全前端Web報表打印方法彙總 （一）背景介紹 大家在日常辦公過程中經常需要進行文檔打印，比如：打印Excel表格、PPT文檔、照片。此外，在大家使用的各種應用系統中也都提供了打印功能，而不是讓大家必須導出一個Excel或者PDF文件再進行打印，比如：CRM中的合同打印、ERP中的BOM物料清單打印、HIS醫療信息系統中的電子病歷打印、WMS中的出庫入庫單、財務系統中的發票打印等等。這些集成到應用
Angular V20 新特性
引言 Angular 框架在經歷了過去幾年的重大變革後，於2025年5月正式發佈了v20版本。這一版本標誌着Angular在響應式編程、無Zone.js應用、服務器端渲染等多個關鍵領域取得了突破性進展。本文將全面解析Angular v20的核心新特性，包括API穩定化、開發者體驗優化、性能提升工具等，幫助開發者掌握最新技術動態並應用於實際項目開發。 正文 一、響應式特性全面穩定 Angular S
將 Node.js REST API 改造為 AI 就緒的 MCP 服務器
將 Node.js REST API 改造為 AI 就緒的 MCP 服務器 瞭解如何將 Node.js REST API 升級為 AI 就緒的模型上下文協議（MCP）服務器，以支持智能的、由智能體驅動的交互能力。 大型語言模型（LLM）與智能體 AI 的發展，要求應用程序暴露能力的方式發生根本性轉變。傳統 REST API 專為軟件對軟件通信設計，需要開發者閲讀文檔並編寫自定義集成代碼。而模型上下
提升 Web 端 JavaScript 的可信度：WAICT 體系詳解
提升 Web 端 JavaScript 的可信度：WAICT 體系詳解 在當前互聯網時代，網頁是最強大的應用平台。只要在瀏覽器中擁有合適的 API，你理論上可以安全運行任何你想運行的東西。不過——除了“加密學”這塊。事實上，自 2011 年以來，“網頁中的 JavaScript 加密”一説就被認為是“不靠譜”的。 其核心問題在於：代碼的分發。如果我們在客户端瀏覽器中生成密鑰，從而讓用户能夠發送／
面向智能體與大語言模型的 AI 基礎設施：選項、工具與優化
面向智能體與大語言模型的 AI 基礎設施：選項、工具與優化 本文探討了用於部署和優化 AI 智能體（AI Agents）與大型語言模型（LLMs）的各類基礎設施選項及工具。 無論採用雲、本地還是混合雲部署，基礎設施在 AI 架構落地過程中都起着關鍵作用。本文是 AI 基礎設施系列文章的一部分，聚焦於部署和優化 AI 智能體與大語言模型的多樣化基礎設施選擇，深入剖析了基礎設施在 AI 架構（尤其是推
AI 基礎設施指南：工具、框架與架構流程
AI 基礎設施指南：工具、框架與架構流程 本文涵蓋 AI 基礎設施的方方面面，從硬件加速、模型服務到監控與安全，提供了經過生產環境驗證的工具、模式及策略。 構建穩健的 AI 基礎設施，需要理解跨多個技術層級的理論基礎與實際實現細節。本綜合指南為各類規模 AI 系統的架構設計、部署及管理提供了權威參考——無論是實驗性原型，還是服務數百萬用户的企業級生產部署均可適用。 現代 AI 應用對基礎設施提出了
開發者必備 SVG 手冊：從入門到 Path 實戰，圖標、動畫、自適應一次搞定
開發者必備 SVG 手冊：從入門到 Path 實戰，圖標、動畫、自適應一次搞定 引言 SVG 絕對是瀏覽器裏最有意思的技術之一！用它能實現超多酷炫效果，也是前端開發工具箱裏絕對關鍵的一環。 先給大家快速看看前端開發用 SVG 做過的一些東西： （原文此處有示例圖，實際場景可替換為自己的 SVG 作品展示） 不過 SVG 也挺讓人望而生畏的------這玩意兒水很深，很容易看得眼花繚
認證與授權全攻略：從 Basic、JWT 到 RBAC、ABAC，開發者該怎麼選？
認證與授權全攻略：從 Basic、JWT 到 RBAC、ABAC，開發者該怎麼選？ 引言：別搞混！認證和授權是兩回事 做開發時，我們常把“認證”和“授權”掛在嘴邊，但很多人其實沒分清二者的核心區別： 認證（Authentication）：解決“你是誰”的問題——比如登錄時輸密碼、掃人臉，本質是確認“用户身份合法”。 授權（Authorization）：解決“你能做什麼”的問題——比如登錄
火狐退出中國後，Zen 瀏覽器會是「理想平替」嗎？
葡萄城思否問答子站 引言 從隱私保護到擴展兼容，無縫承接國內用户需求，用革新設計重塑瀏覽體驗 Mozilla Firefox（火狐瀏覽器）曾是國內不少用户的「隱私首選」------憑藉開源內核、豐富擴展生態和自主可控的隱私設置，它一度成為避開 Chromium 生態的重要選擇。但近日火狐即將宣佈徹底關閉中國市場後，不僅官方服務支持中斷、本地化功能（如中文同步、國內鏡像更新）逐步失效，「如何找
瀏覽器端音視頻處理新選擇：Mediabunny 讓 Web 媒體開發飛起來
瀏覽器端音視頻處理新選擇：Mediabunny 讓 Web 媒體開發飛起來 在 Web 開發中，音視頻處理一直是個“老大難”問題：傳統方案要麼依賴後端服務器中轉（延遲高、成本高），要麼使用移植自桌面的庫（體積大、性能差），始終缺乏一個“為 Web 而生”的輕量高效解決方案。而今天要介紹的 Mediabunny，正是填補這一空白的 JavaScript 庫——它能直接在瀏覽器中實現音視頻的讀取、寫入
瀏覽器端音視頻處理新選擇：Mediabunny 讓 Web 媒體開發飛起來
瀏覽器端音視頻處理新選擇：Mediabunny 讓 Web 媒體開發飛起來 在 Web 開發中，音視頻處理一直是個"老大難"問題：傳統方案要麼依賴後端服務器中轉（延遲高、成本高），要麼使用移植自桌面的庫（體積大、性能差），始終缺乏一個"為 Web 而生"的輕量高效解決方案。而今天要介紹的 Mediabunny，正是填補這一空白的 JavaScript 庫------它能直接在瀏覽器中實現音視頻的讀