資訊專欄INFORMATION COLUMN
摘要：不過，前端開發的現狀其實也很瘋狂。并不是只有你感到抓狂。你要創建的網頁應用基本上都會出現在鐘形曲線中間的某個位置。開始開發應用時，關鍵在于在鐘形曲線上選取一個點，作為你的應用最終復雜程度的上限。
【編者按】本文作者為 Sean Fioritto，主要闡述了 JavaScript 開發為何讓人有些無從下手的根本原因。文章系國內 ITOM 管理平臺 OneAPM 編譯呈現。
網絡開發樂趣多多！Javascript 卻……讓人望而卻步。
網頁開發的其他所有東西都很配合，唯獨到了 Javascript，你會感覺好像比別人少了一大塊基礎知識，完全搞不懂它。
事實就是，沒錯，你的確缺了幾塊拼圖。
不過，前端開發的現狀其實也很瘋狂。
并不是只有你感到抓狂。拉把椅子坐下來。該寫個 Javascript 應用了。
首先要搭建和運行本地環境。是用 Gulp，還是 Grunt，都不好……還是用 NPM 腳本吧！
Webpack 還是 Browserify？（不好意思地）還是 Require.js？要升級到 ES6 嗎？在預處理中加入 Babel 是不是太過了？
行為驅動開發還是常規的單元測試？應該選用哪種斷言框架？如果能從命令行運行測試當然是好事，那何不試試 PhantomJS？
Angular 還是 React？Ember 呢？Backbone 怎么樣？
有些 React 文檔寫道：“Redux 是 JavaScript 應用可預見的狀態容器?！碧袅?！你肯定需要來一個。
為什么搭建 Javascript 應用會這么瘋狂？！讓筆者來幫你弄明白為什么這些看起來都這么瘋狂。首先看個例子，然后再看漂亮的圖片。
以下是 React 的“Hello, world!”應用。
// main.js
var React = require("react");
var ReactDOM = require("react-dom");
ReactDOM.render(
Hello, world!
,
document.getElementById("example")
);
這還沒完。
$ npm install --save react react-dom babelify babel-preset-react $ browserify -t [ babelify --presets [ react ] ] main.js -o bundle.js
其實中間缺了幾個步驟，比如說安裝 browserify，還有完成這些之后還要做什么，才能讓它在網頁上運行，因為僅僅這些并不能生成一個有用的網頁。
完成這些之后，會得到一個名為 bundle.js 的文件，里面就是新的 React Hello World 應用，包含 19374 行代碼。接下來，只需要安裝 browserify、 babelify 和 react-dom，然后衡量未知的成千上萬條代碼。
基本上就是這樣……
現在用基本的 Javascript 來寫一個 hello world 應用。
Hello World
這就是全部內容。18行代碼。你可以把它們復制、粘貼到一個叫 index.html 的文件，雙擊加載到你的瀏覽器。好了。
如果此刻你對自己說：“但是，等一下，React 能做的可不止你剛才寫的那點兒小東西，你不能那么寫 Javascript！”這話（大部分）是正確的，你很快就會發現為什么所有東西都這么瘋狂了。
現在可以看到筆者提到的圖片了。你要創建的 Javascript 網頁應用基本上都會出現在鐘形曲線中間的某個位置。在中間位置，如果一開始你用了 React 全棧，那么你的應用從一開始就極大地違背了設計標準。
這就是為什么所有東西都很瘋狂。你以為你必須使用的工具大部分都是為了解決現在未出現，或者永遠都不會出現的問題。
再看一下這張圖：Javascript 開發現狀讓人無措又迷惑，因為所有人并沒有意識到，在默認狀態下，他們的應用已經違背了設計標準。
你該如何開始搭建 Javascript 應用？你應該用 React 或 Angular 這樣的工具嗎？要是不用該怎么辦？測試到底有沒有必要？還要用 Javascript 生成標記嗎？在開始搭建默認的龐大技術堆棧之前，這些都是你應該回答的問題。開始開發 Javascript 應用時，關鍵在于在鐘形曲線上選取一個點，作為你的應用最終復雜程度的上限。
坦白說，要實現這一點需要經驗。不過還是有很多 Javascript 應用可以借鑒的出發點的：Jquery 加上客戶端模板，還有一個非常簡單的構造工具，用來連接和減少生產文件（假設你的后臺框架還沒有這項功能）。
如果你了解了如何正確構造 Javascript 應用，你就會逐漸明白如何、何時以及為什么要使用框架、npm、require、webpack 或 es6，何時要寫測試，何時應該在本地測試，何時應該在瀏覽器測試，以及其他會出現的問題和麻煩。
本文轉自 OneAPM 官方博客
原文地址：http://www.planningforaliens.com/blog/2016/04/11/why-js-development-is-crazy/
文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。
轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/79425.html
摘要：運用防抖和節流可以有效降低代碼的執行頻率，從而解決高頻率事件的頁面卡頓問題。在階段布局，最終確定顯示的位置和大小。在函數中，首先定義了一個空的定時器變量，用來計算時間間隔。還有一點要注意，在中一定要清楚定時器，不然會影響的條件判斷。 啥是節流？ 節流是保證在一段時間內，代碼只執行了一次。這個一段時間內指的是不管用戶操作了幾次，最終僅執行一次。比如說一個按鈕，用戶狂點按鈕，但是如果用節流...
摘要：運用防抖和節流可以有效降低代碼的執行頻率，從而解決高頻率事件的頁面卡頓問題。在階段布局，最終確定顯示的位置和大小。在函數中，首先定義了一個空的定時器變量，用來計算時間間隔。還有一點要注意，在中一定要清楚定時器，不然會影響的條件判斷。 啥是節流？ 節流是保證在一段時間內，代碼只執行了一次。這個一段時間內指的是不管用戶操作了幾次，最終僅執行一次。比如說一個按鈕，用戶狂點按鈕，但是如果用節流...
摘要：既然小匹夫說不是，但的確有好幾種腳本語言啊，那和相比，我們應該如何抉擇呢所以最后小匹夫會分析一下。因為最后小匹夫意識到了和是兩種差別很大的語言。 前言 又來到了周末，小匹夫也終于有了喘口氣寫寫博客的時間和精力。話說周五的下午，小匹夫偶然間晃了一眼游戲蠻牛Unity3D的QQ群，又看到了一個Unity3D開發中老生長談的問題，我的開發語言究竟是選擇JavaScript呢？還是C#呢？。對...
閱讀 2502·2023-04-25 22:09
閱讀 1018·2021-11-17 17:01
閱讀 1535·2021-09-04 16:45
閱讀 2615·2021-08-03 14:02
閱讀 811·2019-08-29 17:11
閱讀 3249·2019-08-29 12:23
閱讀 1081·2019-08-29 11:10
閱讀 3277·2019-08-26 13:48
