1. 程式人生 > >seajs模組載入與執行原理小記

seajs模組載入與執行原理小記

本文僅討論具名模組的情況,即通過spm打包出來的模組.

今天又研究了下seajs原始碼,原始碼中並沒有顯式的判斷id與路徑相不相等,即沒有類似如下的程式碼

if(id == uri){

  mod.exec();

}

假定被載入的模組為a.js

step1:在載入a.js前,就建立並快取了a.js的module例項A,key值為a.js的全路徑,暫定為uriA

step2:定義好onload事件(這裡ie又出來搗亂了),建立script標籤插入head

step3:瀏覽器載入完a.js後,執行define方法跟蹤程式碼到seajs內部,發現並沒有做什麼特別的事,只是呼叫了Module.save方法,id與路徑的匹配即體現在這個save方法中.且看原始碼:

 1 // Save meta data to cachedMods
 2 Module.save = function(uri, meta) {
 3   var mod = Module.get(uri)
 4 
 5   // Do NOT override already saved modules
 6   if (mod.status < STATUS.SAVED) {
 7     mod.id = meta.id || uri
 8     mod.dependencies = meta.deps || []
 9     mod.factory = meta.factory
10 mod.status = STATUS.SAVED 11 } 12 }

第3行,獲取快取中的module,uri是模組中的id.

假如id與載入路徑相等,那麼這裡可以獲取到step1快取的A,然後將factory等屬性賦給A,結束

假如id與載入路徑不相等,那麼這裡將獲取不到A,會新建立一個新例項B

step4:瀏覽器執行完a.js的程式碼,執行onload回撥,進行一系列的屬性操作(比如waiting和remain)和依賴模組的載入等等,這裡有遞迴...需要花點時間才能看懂.

step5:等step4的所有遞迴執行完,也即a.js及其所有依賴模組都已載入完,執行完,進入就緒狀態,執行a.js的factory,這裡的factory從A中獲取,A通過uriA從快取中獲取.

         如果step3中,a.js中的id與載入它的路徑不一致,那麼這裡A中的factory將是undefined,所以你的factory方法就不執行.

以上是seajs處理模組的大致流程.

至於使id與路徑一致,通常的做法是,use或require裡的直接量字串引數與模組裡的id相等.比如

//html頁面
seajs.use("app/start",function(){ // code }) //start.js define("app/start",["jquery/jquery/1.7.2/jquery"],function(require, exports, module){ //code })

不過,這兩個值通過seajs內部resolve過後能相等,也是可以的.

相關推薦

seajs模組載入執行原理小記

本文僅討論具名模組的情況,即通過spm打包出來的模組. 今天又研究了下seajs原始碼,原始碼中並沒有顯式的判斷id與路徑相不相等,即沒有類似如下的程式碼 if(id == uri){   mod.exec(); } 假定被載入的模組為a.js step1:在載入a.js前,就建立並快取了a.

jsp頁面元素執行原理 Jspservlet的區別聯絡

jsp (java server pages) Jsp頁面元素 7種 1.指令<% page%>,<%@ include%>,<%@ tablib%> 2.小指令碼<% %> 3.表示式<%= %> 4.宣告<%! %>

1.3RDD的設計執行原理

提供一種通用的資料抽象 RDD典型的執行過程如下: RDD讀入外部資料來源(或者記憶體中的集合)進行建立; RDD經過一系列的“轉換”操作,每一次都會產生不同的RDD,供給下一個“轉換”使用; 最後一個RDD經“行動”操作進行處理,並輸出到外部資料來源(或者變成S

(二)css、js 的載入執行

1:一個網站在瀏覽器端是如何進行渲染的呢? 2: HTML渲染過程的一些特點 (1)順序執行、併發載入 順序執行:運用詞法分析能力從頭開始順序解析, 併發載入:引入的外部資源,css,js,可以進行優化,單個域名併發載入有限,CDN上設定三到四個。 (2)是否阻塞 (css載入是否阻塞js載入,

Storm架構執行原理

Storm架構與執行原理 一、Storm簡介 Storm是一個免費並開源的分散式實時計算系統。利用Storm可以很容易做到可靠地處理無限的資料流,像Hadoop批量處理大資料一樣,Storm可以實時處理資料。 Storm 很簡單,可用於任意程式語言。Apache Storm 採用 C

JVM類載入執行時優化

類載入生命週期 a. 裝載(load) i. 開始時機: 1) new例項化物件時,若類沒有載入 2) 讀取或設定一個類static欄位,若類沒有被載入。final除外,因為f

火箭入門GXChain開發系列第一篇|簡介執行原理

火箭入門GXChain開發系列第一篇|簡介與執行原理 第一期:智慧合約簡介與執行原理 智慧合約簡介 智慧合約應用場景 智慧合約與dapp 智慧合約執行原理 webassembly虛擬機器 abi檔案與wast檔案 邏輯與持久化儲存(action與table) 智慧合約環境部署 智慧合

前端效能優化:細說JavaScript的載入執行

本文主要是從效能優化的角度來探討JavaScript在載入與執行過程中的優化思路與實踐方法,既是細說,文中在涉及原理性的地方,不免會多說幾句,還望各位讀者保持耐心,仔細理解,請相信,您的耐心付出一定會讓您得到與之匹配的回報。緣起隨著使用者體驗的日益重視,前端效能對使用者體驗的

前端效能優化---4.css、js 的載入執行

1.一個網站在瀏覽器端是如何進行渲染的呢? 1.我們輸入網址向伺服器傳送請求,伺服器會返回一個html的文件, 2.該html文件會被瀏覽器中的html解析器解析 3.從上到下一步一步的生成D

AOP概念執行原理

引言: AOP指的就是面向切面程式設計,在實際的開發和工作中很多地方都深有體現,比如許可權控制,控制全域性狀態等。接下來會詳細闡述AOP的概念,給出對應的DEMO來深入學習實踐,探討AOP的意義。 技術點: 1、反射(reflect) 在執行狀態

Javascript的載入執行順序

1. 按塊載入並執行對於一個HTML文件,瀏覽器的解析順序為:按照文件流,從上到下逐步解析頁面的結構。JavaScript程式碼作為通過標籤嵌入或引入的指令碼,也HTML文件的組成部分。因此,JavaScript程式碼在裝載時的執行順序也是根據指令碼標籤<script&

springmvc的執行原理小記

SpringMVC執行原理 1. 客戶端請求提交到DispatcherServlet 2. 由DispatcherServlet控制器查詢一個或多個HandlerMapping,找到處理請求的Controller 3. DispatcherServlet將請求提交

瀏覽器環境下JavaScript指令碼載入執行探析之deferasync特性

defer和async特性相信是很多JavaScript開發者"熟悉而又不熟悉"的兩個特性,從字面上來看,二者的功能很好理解,分別是"延遲指令碼"和"非同步指令碼"的作用。然而,以defer為例,一些細節問題可能開發者卻並不一定熟悉,比如:有了defer特性的指令碼會延遲到什麼時候執行;內部指令碼和外部指

MySQL執行原理基礎架構細說

1.MySQL基礎              MySQL是一個開放原始碼的關係資料庫管理系統。原開發者為瑞典的MySQL AB公司,最早是在2001年MySQL3.23進入到管理員的視野並在之後獲得廣泛的應用。 

深入剖析 Web 伺服器 PHP 應用之間的通訊機制 - 掌握 CGI 和 FastCGI 協議的執行原理

本文首發於 深入剖析 Web 伺服器與 PHP 應用之間的通訊機制 - 掌握 CGI 和 FastCGI 協議的執行原理,轉載請註明出處! 身為一名使用 PHP 語言開發後端服務的程式猿,我們每天都和 PHP 以及 Web 伺服器產生無數次的親密接觸。得益於它們,我們才能

ElasticSearch教程——filter執行原理深度剖析(bitset機制caching機制)

ElasticSearch彙總請檢視:ElasticSearch教程——彙總篇 (1)在倒排索引中查詢搜尋串,獲取document list date來舉例 word          doc1    &nb

33 python Threading模組執行執行緒池 GIL鎖

---恢復內容開始--- 一 python Threading模組與執行緒   multiprocess模組完全模仿了threading模組的介面,二者在使用層面有較大的相似處。 1. 執行緒的建立 from threading import Thread def func(m)

深入理解JVM虛擬機器讀書筆記【第九章】類載入執行子系統的案例實戰

9.1 概述 9.2 案例分析 9.2.1 Tomcat:正統的類載入器架構 9.2.2 OSGI:靈活的類載入器架構 9.2.3 位元組碼生成技術與動態代理

如何讓 node 執行 es6 模組檔案,及其原理

如何讓 node 執行 es6 模組檔案,及其原理 最新版的 node 支援最新版 ECMAScript 幾乎所有特性,但有一個特性卻一直到現在都還沒有支援,那就是從 ES2015 開始定義的模組化機制。而現在我們很多專案都是用 es6 的模組化規範來寫程式碼的,包括 node 專案,所以,node 不能執

Java操作Shell指令碼 + Java.lang.Process的原理分析 + 程序執行緒的分析 + 多執行緒理解

目錄 什麼是程序 什麼是執行緒 總結: 參考連結 java程式中要執行linux命令主要依賴2個類:Process和Runtime 程序執行緒的關係 什麼是程序 簡單理解,在多工系統中,每一個獨立執行的程式就是一個程