尤雨溪的 Live 說了哪些技術名詞？

時間 2019-11-16

標籤 live 哪些技術名詞简体版

原文原文鏈接

購買 Live 請點這裏css

如下都是我本身的理解，不是原話。html

本文只列舉和解釋名詞，想聽大神的觀點仍是要買 Live 。前端

這篇文章主要是給兩類人看：node

買了 Live 可是沒有聽清裏面的一些英文的人。
想買 Live，可是怕買了 Live 聽不懂的人。react

UDP

開場有一個 UDP 笑話。git

不少前端聽不懂這個笑話。這個笑話跟另外一個笑話很像：github

A:「我給你們講一個笑話：從前有個太監。」
B: 下面呢？
A: 「下面沒了」
B: 哈哈編程

那麼這個 UDP 的笑話是什麼意思？隨便搜一下你就知道：由於UDP沒有TCP那些可靠的機制，在數據傳遞時，若是網絡質量很差，就會很容易丟包。瀏覽器

因此這個笑話是關於丟包的……網絡

我這麼嚴肅地解釋笑話是否是很尷尬……

框架挑選

不談場景論好壞都是耍流氓。
你要作的應該是該用 Vue 的時候用 Vue，該用 React 的時候用 React，該用 jQuery 的時候用 jQuery。

你一個都沒學會？算我沒說。

至於如何挑選框架，只有老司機會選，你首先要變成一個老司機。

組件

組件已是各類框架的共識，你必須知道什麼是組件。組件的定義就是……一個很抽象的東西。個人理解是變形金剛合體的時候，有人組成頭部，有人組成襠部，這些人就是組件了。

每一個組件能夠由其餘小組件組成。好比襠部能夠分紅柱狀組件和兩球狀組件。

至於組件的嚴格定義，並無。

組件的狀態（state）

一個組件能夠有多種形態，好比上面的柱狀組件能夠是硬直狀態，也能夠是疲軟狀態。（原諒我飆車了）。

組件的分類

展現型組件、接入型組件（如 container）、交互型組件（如 form）、功能型組件（如 router、transition）

JSX V.S. 模板

Tutorial: JSX
JavaScript Templating

JSX 適合邏輯多的場景，模板適合邏輯少的場景。

Colocation

把該放在一塊兒的東西放在一塊兒。

跟幾年前的 HTML、CSS、JS 分離對應。

Separation Concerns

關注點分離

前端的關注點分離就是 HTML、CSS、JS 分離。

Declarative Programming 聲明式編程

你說有啥，就有啥。

wikipedia

Imperative programming 命令式編程

你讓我幹啥，我就幹啥。

wikipedia

意大利麪條式編程

你以爲誰的代碼爛，你就能夠說誰的代碼是意大利麪條。

Spaghetti code

view = render(state)

給我一個 state（數據），我就造出一個 view（DOM）。

Virtual DOM

計算機科學領域的任何問題，均可以經過添加一箇中間層來解決。

Virtual DOM 就是應用與 DOM API 之間的中間層。

Manual DOM manipulation is messy and keeping track of the previous DOM state is hard. A solution to this problem is to write your code as if you were recreating the entire DOM whenever state changes. Of course, if you actually recreated the entire DOM every time your application state changed, your app would be very slow and your input fields would lose focus.

virtual-dom is a collection of modules designed to provide a declarative way of representing the DOM for your app. So instead of updating the DOM when your application state changes, you simply create a virtual tree or VTree, which looks like the DOM state that you want. virtual-dom will then figure out how to make the DOM look like this efficiently without recreating all of the DOM nodes.

摘自：Matt-Esch/virtual-dom

本身寫一個 Virtual DOM 庫並不難。