前言 如果我們選擇不使用任何框架的情況下來進行前端開發，那麼針對一個完整的網頁，我們需要開發以下代碼： HTML 代碼 CSS 代碼 JavaScript 代碼 就幾年之前來説，HTML 部分的代碼基本不存在複用的可能，這就導致我們可能需要開發大量重複的 HTML 代碼，即使使用 CV 法，代碼的冗餘卻是不可避免的。 Web Components 誕生的背景 近幾年，我們在使用前端框架（
昵稱 編程三昧
什麼是 amiya amiya 是一個組件庫，是對Ant Design的二次封裝，提供頁面級別的組件。 文檔地址 它有什麼特點？ 表單只讀模式 默認的 antd 只對少數組件支持 readonly 模式，而 disabled 模式會把 placeholder 顯示出來，且有可能展示不完整。 所以 amiya 為每一種表單類型，提供 readonly 模式，去除默認的圖標符號，變更背景顏色於文字顏色
昵稱 viewweiwu
前言 今天前端生態裏面，React、Angular和Vue三分天下。雖然這三個框架的定位各有不同，但是它們有一個核心的共同點，那就是提供了組件化的能力。W3C也有Web Component的相關草案，也是為了提供組件化能力。今天我們就來聊聊組件化是什麼，以及它為什麼這麼重要。 正文 其實組件化思想是一種前端技術非常自然的延伸，如果你使用過HTML，相信你一定有過“我要是能定義一個標籤就好了”這樣的
昵稱 浪遏飛舟
“老哥，聽説你寫的頁面挺多的，我這兒有一個頁面，你覺得你需要多少代碼？” “我看看，也還行吧，不就是個查詢表格嘛，現在大家都用 ProComponent 了，用那個寫一下很快的。我想想，差不多 200 行左右就可以了吧。” “那個呀，我知道，官方的二次封裝組件庫，200 行就可以了嗎？嗯，可以。等等，你説的代碼是否包含了操作按鈕？” “操作按鈕？是指你圖上的 【新增】【詳情】這些按鈕嗎？” “是
昵稱 viewweiwu
動機 當市面上主流的組件庫不能滿足我們業務需求的時候，那麼我們就有必要開發一套屬於自己團隊的組件庫。 環境 開發環境： vue 3.0 vue/cli 4.5.13 nodeJs 12.16.3 npm 6.14.4 步驟 創建項目 使用 vue-cli 創建一個 vue3 項目，假設項目名為 custom-npm-ui $ vue create custom-npm-ui 手動選擇
昵稱 米花兒團兒
快速開始 安裝依賴 mkdir projectName路徑下 cd projectName npm init -y npm i -D vitepress pkg#scripts "scripts": { "docs:dev": "vitepress dev docs", "docs:build": "vitepress build docs", "docs:serve"
昵稱 米花兒團兒
1 antd中，input組件在觸發onChange時，如果是中文輸入模式，會頻繁被觸發，導致頁面性能降低。尤其是在onChange時需要實時搜索的情況。 2 在mac設備下，如果在onChange中使用value.replace(/\s/g,''/), 會出現無法輸入中文的問題。優化之後，可以正常輸入。 默認情況下的Input組件： 優化之後的ChineseInput 調用方式：
昵稱 jsoncode
同 Angular Module 不同，Angular Components 和 Directives 要實例化多次，每個出現在 HTML template 中的 markup 都會對應一次實例化。 此外，這些項的作用域也限定在它們被導入的 NgModule中，以防止兩個組件使用相同的選擇器時發生命名衝突。由於依賴注入(DI)行為的這種差異，需要區分一個包含組件和指令的 NgModule 和一個包
昵稱 註銷
當使用多 tab 內容頁時，動態組件是一件非常好用的利器。但是循環動態組件會有個問題，那就是不同組件綁定不同的屬性值和方法，全部寫在組件內固然是一種方法，就是不方便管理和查看，所以以下是單獨聲明的技巧小 tips。 切換的tabs常量 const TABS = [ { label: 'tab1', compo: 'RankingList', props: [
昵稱 phoenixhg
1. 關於Element-plus的菜單渲染問題 跨過了Element-UI，終於來到了Element-plus。又回到了一個老問題，menu的渲染。 創建一個menu數組，利用v-for來渲染數組，生成menu，非常常規的操作。但是操作的過程中，出現了一個小問題，就是關於icon的渲染。 我們知道，在Element-plus中，渲染一個帶圖標的菜單項，是這麼搞的： el-menu-i
昵稱 wei4118268
當我們要渲染一個組件時，通常並不需要關心它是如何定義（是Class還是Function）： function Greeting() { return pHello/p; } class Greeting extends React.Component { render() { return pHello/p; } 使用 // 是類還是函數 —— 無所謂 Greeting /
昵稱 小盼田
起因 用React.PureComponent時，更新state裏面的count用的方式是++this.state.count，但是意外的導致組件沒有重新render（本人用Hook組件較多，所以感到很疑惑） import React from 'react'; import { Button } from 'antd-mobile'; class DemoChildClass extends
昵稱 起風了
業界已經達成共識：CI/CD 是落地實踐 DevOps 的重要手段，其本質是將軟件交付流程中的步驟自動化運行起來，從而提高軟件交付效率。隨着企業規模擴大（人員增加、產品增多等），高效構建 CI/CD 成為研發效能提升的關鍵。 極狐GitLab CI 內置於極狐GitLab 一體化平台，提供開箱即用的 CI/CD 能力，也是受眾多用户喜愛的 CI 工具之一。極狐GitLab CI 獨特的設計機制和企
昵稱 極狐GitLab
搭建開發環境 Vite初始化 新建一個空的文件夾，比如叫 Vue3UI ，然後使用命令行在此文件夾下使用npm初始化： npm init 回車後，我們再安裝vite（我們這裏選擇使用Vite進行打包，使用別的也類似）： npm install --save-dev vite 根目錄創建 index.html 文件，裏面內容如下： !DOCTYPE html html lang="zh-cn"
昵稱 zxl20070701
Spring Boot 中的 @Bean 與 @Component  Spring 的 @Component 和 @Bean 註解的關鍵區別在於：@Bean 註解可用於暴露您自己編寫的 JavaBeans，而 @Component 註解可用於
昵稱 信碼由繮
為什麼需要CDN？ 當用户訪問你的網站時，如果服務器距離較遠，加載圖片或視頻就會變慢。CDN（內容分發網絡）通過在全球多地部署緩存服務器，讓用户從最近的節點獲取數據。就像在多個便利店儲備商品，顧客不需要每次都跑回總倉庫取貨。 第一步：硬件與網絡準備 關鍵原則：匹配你的用户規模 小型站點（日訪問量1萬）：普通服務器即可滿足 中型服務（1萬~10萬訪問量）：需要專業級配置 大型平台（10萬訪問
@guangmingleiluodetouyingyi_bccdlf
昵稱 光明磊落的投影儀
一種高效、便捷的部署方式。 隨着大模型技術的快速發展，業界的關注點正逐步從模型訓練往模型推理轉變。這一轉變不僅反映了大模型在實際業務中的廣泛應用需求，也體現了技術優化和工程化落地的趨勢。 魔搭社區（ModelScope）作為開源大模型的聚集地，結合阿里雲邊緣雲 ENS ，提供了一種高效、便捷的部署方式。通過按需付費和彈性伸縮，開發者可以快速部署和使用大模型，享受雲計算的便利。本文介紹了魔搭社
昵稱 CloudImagine
網站被ddos怎麼辦！網站被sql入侵怎麼辦！ 在互聯網環境中，網站面臨的安全威脅日益增多，其中DDoS（分佈式拒絕服務）攻擊和SQL注入攻擊是兩種常見而具有破壞力的攻擊方式。為了保護網站的安全，必須採取有效的應對策略和防護措施。以下是詳細的處理步驟和預防方法。 DDoS攻擊的特徵 DDoS攻擊通過發送大量惡意流量使目標網站癱瘓。攻擊者往往使用多個受感染的計算機（botnets）同時
昵稱 德迅雲安全_初啓
騰訊雲 EdgeOne 深度測評：下一代 CDN 的加速與防護實戰體驗 一、背景與測試環境 作為一名個人站長，我長期運營着一個導航站。由於服務器位於香港，配置為 2C2G5M，再加上域名來自海外註冊商，站點在不使用加速服務時訪問速度明顯偏慢。因此，CDN 一直是我站點運行必不可少的環節。 此前我也使用過其他雲廠商的傳統 CDN，整體體驗在訪問速度方面尚可，但在防護能力和可運維性上表現一般。最近了解
昵稱 逐夢AI
本文系轉載，轉載鏈接：SCDN比傳統CDN好在哪？安全+加速二合一 前言 做線上業務的人，多半遇到過這些糟心事兒：電商大促時網站卡到付款按鈕點不動，遊戲剛開服就被攻擊到掉線，甚至辛苦做的網站被注入惡意代碼。這些問題，本質上是“內容傳得慢”和“安全沒保障”的雙重痛點。而SCDN防禦服務器，就像給業務裝了“加速引擎+安全盾牌”，既讓用户訪問更快，又能擋住各種惡意攻擊。本文就拆解SCDN的“過人之處”，
昵稱 雲輕雨細
本文系轉載，轉載鏈接：提升網站性能的10個CDN配置優化技巧 在數字化時代，內容分發網絡（CDN）已成為全球網站加速的核心技術。通過智能分配節點資源，CDN不僅能將頁面加載速度提升40%-60%（根據Akamai研究報告），更能有效降低服務器帶寬成本。本文將深入解析10個經過驗證的CDN配置策略，幫助技術團隊最大化網絡加速效果。 一、智能選擇CDN服務商的關鍵指標 1.全球節點覆蓋質量 優先選
昵稱 雲輕雨細
在互聯網時代，網站的訪問速度和安全性直接影響用户體驗和業務成敗。CDN（內容分發網絡）與高防CDN作為提升網站性能和抵禦網絡攻擊的關鍵工具，已成為眾多企業的必備之選。 但兩者之間有什麼區別？企業又該如何選擇？ 一、免費的CDN 與高防 CDN 的基本定義與區別 免費的CDN（內容分發網絡） 是一種基礎性的網絡服務，旨在通過在全球分佈的節點上緩存網站內容（如圖片、視頻、CSS文件等），縮短用户訪問距
昵稱 德訊雲安全如意
前言 “明者防禍於未萌，智者圖患於將來”，在網絡世界裏，網站就像我們在線上的“店鋪”，一旦遭遇攻擊，數據泄露、頁面癱瘓等問題會直接影響業務，甚至暴露自己的個人信息！ 而CDN，就是我們網站安全的“得力幫手”。今天就講講CDN以及它如何保護的網站安全。 一、為什麼要重視網站安全？別等“出事”才後悔 可能有人覺得“我的網站規模小，沒人會攻擊”，但實際上，網絡攻擊從不“挑大小”。小到個人博客被植入惡意代
昵稱 雲輕雨細
LocalStorage 是一個 HTML5 網絡存儲對象，用於將數據存儲在客户端——即本地，在用户的計算機上。 本地存儲的數據沒有到期日期，並且會一直存在，直到被刪除。 （相比之下，會話存儲是另一個 HTML5 網絡存儲 API，它會在瀏覽器關閉時刪除存儲的數據。） 本地存儲是純 JavaScript。 同樣，雖然它仍然在用户的設備上生成純文本文檔，但本地存儲也允許存儲多達 5MB 的數據（與
昵稱 註銷