sea.js

renweihub 發布于2019-08-19 17:48 / 3016人閱讀

摘要：目標了解目前公司所用得代碼模塊式開發。比較目前比較流行得框架。模塊化可以讓每個文件的職責單一，非常有利于代碼的維護。模塊定義規范與的模塊規范非常相近。一類是以國內的等類庫為代表的大教堂模式。

目標：1.了解目前公司所用得sea.js,代碼模塊式開發。

 2.比較目前比較流行得bootstrap,angularJS,reactJS框架。

參考：http://seajs.org/docs/#docs
1）除了解決命名沖突和依賴管理，使用 Sea.js 進行模塊化開發還可以帶來很多好處：
1.模塊的版本管理。通過別名等配置，配合構建工具，可以比較輕松地實現模塊的版本管理。

2.提高可維護性。模塊化可以讓每個文件的職責單一，非常有利于代碼的維護。Sea.js 還提供了 nocache、debug 等插件，擁有在線調試等功能，能比較明顯地提升效率。

3.前端性能優化。Sea.js 通過異步加載模塊，這對頁面性能非常有益。Sea.js 還提供了 combo、flush 等插件，配合服務端，可以很好地對頁面性能進行調優。

4.跨環境共享模塊。CMD 模塊定義規范與 Node.js 的模塊規范非常相近。通過 Sea.js 的 Node.js 版本，可以很方便實現模塊的跨服務器和瀏覽器共享。

前端的模塊化構建可分為兩大類。一類是以 Dojo、YUI3、國內的 KISSY 等類庫為代表的大教堂模式。在大教堂模式下，所有組件都是顆粒化、模塊化的，各組件之間層層分級、環環相扣。另一類是以 jQuery、RequireJS、國內的 Sea.js、OzJS 等類庫為基礎的集市模式。在集市模式下，所有組件彼此獨立、職責單一，各組件通過組合松耦合在一起，協同完成開發。

AngularJs:開源得javascript框架，適合于開發客戶端得單頁面應用，它實現了前端MVC架構，專注于擴展html功能，提供動態技術綁定，且能與其他框架合作融洽。（大概有個概念，今后再詳細了解）

API 快速參考
1）seajs.config 用來對 Sea.js 進行配置。
https://github.com/seajs/seajs/issues/262
2）seajs.use 用來在頁面中加載一個或多個模塊。
https://github.com/seajs/seajs/issues/260
3）define 用來定義模塊。Sea.js 推崇一個模塊一個文件，遵循統一的寫法：
https://github.com/seajs/seajs/issues/242
https://github.com/seajs/seajs/issues/259
4）require 用來獲取指定模塊的接口
https://github.com/seajs/seajs/issues/242
https://github.com/seajs/seajs/issues/259
5）require.async 用來在模塊內部異步加載一個或多個模塊。
https://github.com/seajs/seajs/issues/242
6）exports 用來在模塊內部對外提供接口。
https://github.com/seajs/seajs/issues/242
7)module.exports 用來在模塊內部對外提供接口。
https://github.com/seajs/seajs/issues/242

深度探討：
一.CMD 模塊得構建過程
CMD模塊在構建時，有兩個基本操作：
1.提取操作，用來提取模塊得標識id和一來dependencies.

a.js

define(function(require, exports) {
  var b = require("./b");
})
經過提取操作后，a.js 的源碼會轉換成臨時文件：

define("xxx/1.0.0/a", ["./b"], function(require, exports) {
  var b = require("./b");
})

2.壓縮操作。經過上面得提取操作后，構建工具就可以調用任何JS壓縮工具來進行壓縮了，require 參數也可以被壓縮成任意字符。

云服務器 GPU云服務器

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://m.specialneedsforspecialkids.com/yun/78848.html

sea.js的同步魔法

摘要：寫法加載完后，得到的執行結果作為參數傳入了回調函數寫法預加載了執行模塊，并得到結果賦值給調用模塊提供的方法從這一點上來看，兩者在性能上并沒有太多差異。前些時間也是想寫點關于CMD模塊規范的文字，以便幫助自己理解。今天看到一篇知乎回答，算是給了我一點啟發。同步寫法卻不阻塞？先上一個sea.js很經典的模塊寫法： // 定義一個模塊 define(function(require, ...

cloud 2019-08-26 18:42 評論0 收藏0
閱讀sea.js源碼小結

摘要：依賴信息是一個數組，比如上面的依賴數組是源碼如下是利用正則解析依賴的一個函數時間出發函數主要看這個部分注釋是防止拷貝該時間的回調函數，防止修改，困惑了一下。對的賦值需要同步執行，不能放在回調函數里。 sea.js想解決的問題惱人的命名沖突煩瑣的文件依賴對應帶來的好處 Sea.js 帶來的兩大好處：通過 exports 暴露接口。這意味著不需要命名空間了，更不需要全局變量。...

chavesgu 2019-08-19 18:37 評論0 收藏0
前端模塊化之AMD/require.js、CMD/sea.js

摘要：代碼地址模塊化的主要區別此前年前前前前前端模塊化，主流的就是，支持的二者都可以用為什么模塊化一直以來，前端開發的痛點之一就是代碼復用職責劃分問題，兼容性比如等新語法的支持組件化代碼壓縮等不在本文討論范圍。showImg(https://user-gold-cdn.xitu.io/2019/5/22/16adee75f360801a); 前言請注意，現在是2019/05/22，這！不！是！墳...

buildupchao 2019-05-22 19:38 評論0 收藏0
前端seajs模塊化實踐

摘要：前端模塊化開發的價值惱人的命名沖突煩瑣的文件依賴使用來解決除了解決命名沖突和依賴管理，使用進行模塊化開發還可以帶來很多好處模塊的版本管理。模塊化可以讓每個文件的職責單一，非常有利于代碼的維護。模塊定義規范與的模塊規范非常相近。前端模塊化開發的價值1、惱人的命名沖突2、煩瑣的文件依賴使用 Sea.js 來解決除了解決命名沖突和依賴管理，使用 Sea.js 進行模塊化開發還可以帶來很多好...

SHERlocked93 2019-08-22 16:06 評論0 收藏0
vue2.0+seajs開發

摘要：官方推薦使用開發項目但是在我在打包后沒有解決好如何打包成的問題。在頁尾，通過引入后，有一段配置代碼的簡單配置加載入口模塊在下載完成后，會自動加載入口模塊。即入口文件語法規范遵循規范，可以像一般書寫模塊代碼。 vue官方推薦使用webpack+vue-cli開發Vue項目但是在我在webpack npm run dev 打包后沒有解決好如何打包成apk的問題。所以就無奈的使用的sea...

wangtdgoodluck 2019-08-20 14:17 評論0 收藏0