怎麼理解組件化開發

組件化沒有官方嚴格的定義，如下是對網絡中一些說法的整理

1.    對組件的理解

原文http://www.cnblogs.com/yexiaochai/p/5228871.html

a)     UI組件

項目各個頁面中，會產生不少重複的功能，好比彈出層提示框，像這種純粹非業務的UI，便成了咱們所謂的UI組件，最初的前端組件也就僅僅指的是UI組件。

b)     業務組件

而因爲移動端的興起，前端頁面的邏輯已經變得很重了，一個頁面的代碼超過5000行的場景漸漸增多，這個時候頁面的維護便會頗有問題，牽一髮而動全身的事情會常常發生，爲了解決這個問題，便出現了前端組件化，這個組件化就不是UI組件了，而是包含具體業務的業務組件。

c)     組件化思想--分而治之

這種開發的思想其實也就是分而治之（最重要的架構思想），頁面邏輯過於複雜，便將頁面分爲不少個業務組件模塊分而治之，這樣的話維護人員每次只須要改動對應的模塊便可，以達到最大程度的下降開發難度與維護成本的效果，因此如今比較好的框架都會對組件化做必定程度的實現。

d)     數據

組件通常是與展現相關，視覺變動與交互優化是一個產品最容易產生的迭代，因此多數組件相關的框架核心都是View層的實現，好比Vue與React的就認爲本身僅僅是「View」，雖然展現與交互不斷的在改變，可是底層展現的數據卻不常變化，而View是表象，數據是根本，因此如何能更好的將數據展現到View也是各個組件須要考慮的，從而衍生出了單向數據綁定與雙向數據綁定等概念，組件與組件之間的通訊每每也是數據爲橋樑。

e)     複雜業務是關鍵

因此若是沒有複雜的業務邏輯的話，根本不能體現出組件化編程解決的痛點

2.    組件化定義

做者：張立理

連接：https://www.zhihu.com/question/29735633/answer/90872147

我將「組件化」理解爲如下幾要素：

a)     組件是對邏輯的封裝，不限於圖形元素。

即咱們能夠把if作成組件、把一個倒計時作成組件、把一段動畫作成組件、把路由作成組件、把數據架構作成組件，而這些並不能稱爲控件

b)     組件具有單個可移植性

即「隨加載隨用」，不須要爲其準備複雜的基礎條件（如引入樣式、引入框架等）。然而這一點現有那些所謂組件庫作得並很差，技術上也不大現實

c)     組件是聲明式定義的，而非命令式。

這個不想多說，很大程度上是本身主觀的一個想法而上面最重要的就是第一點，因此要問我什麼是「組件化開發」，個人說法是：把圖形、非圖形的各類邏輯均抽象爲一個統一的概念（組件）來實現開發的模式。

這與傳統開發框架的最大區別就是統一了圖形元素與非圖形元素，除此以外我再想不出其它真正體現區別的點了在這個概念下，包括router、ajax、module loader、timer、animation、interval等，都是組件，共享統一的生命週期管理和對外接口，且都是聲明式地進行組合。