SAO总结
Application Structure
?
Web App-------------------------------------------------------------->Server/BW Web Service-------------------------------->DataBase
?
從Request------Server的結構來設計應用。
Ajax Request相當于URL request。
一個是局部刷新,一個是整頁刷新。
這個是從Life Cycle來看的。一個Life Cycle 就是Request------------>Callback---------------->Call func
但是整個流程可以包含多個Life Cycle.
一個Life Cycle是一個單元。
這個是和業(yè)務無關的東西,即生命周期。
?
?
RPA是通過URL Request來更新HTML, <script>加載JS。 ? ? ? ? ? 一次跳轉(zhuǎn),相當于頁面切換。數(shù)據(jù)通過 Request JSON, XML。
SPA是通過Ajax Request來更新HTML, 加載js。 一次Request HTML,相當于頁面切換。數(shù)據(jù)通過 Request JSON是共性。
?
Round Page Application頁面切換通過URL Request.
Single Page Application頁面切換通過Ajax Request HTML, script.
?
RPA Data通過Request JSON, Text, XML.
SPA Data通過Request JSON, Text, XML.
?
SPA大致的Life Cycle
Request HTML, JS1----------------------------------->CallBack HTML, JS1---------------------------->Call JS1中的func(Request Text, JSON, XML...).
在JS1中 Request JSON, Text, XML...
?
URL Request HTML, script.js File-----------> Render Page file-------------------> Call script.js file's Func (get/send?Data(Text, JSON, XML))
[Ajax Request HTML, script.js File---------> CallBack HTML, script.js file(eval)](這相當于1步)---> Call script.js file's Func (get/send Data(Text, JSON, XML))
任何頁面切換都是從Request HTML,JavaScript開始的。
?
========>在SAO中,Request HTML, Script.js File時并不加載數(shù)據(jù)Data,Data在Script.js中加載。
Data數(shù)據(jù)都是在<script>或者script.js中加載。
<script>, script.js負責加載數(shù)據(jù), 頁面生成,事件響應。
?
<script>, script.js-------------------- Data(Text, JSON, XML) ------------------------>Server
<script>, script.js主要的內(nèi)容就是set Data, send Data.?
?
1.Ajax Request HTML, script.js File/CallBack(eval) HTML, script.js file -------------------------->2.<script>, script.js響應事件,Get/Send Data
?
?
關于SPA
innerHTML中的<script> // </script>, <script src=""></script>并不能執(zhí)行。因此 Ajax Request HTML并不能切換頁面,還需要Ajax Request script.js File。
同時JS的執(zhí)行不能依賴于HTML 頁面加載的事件,比如onload,而是要依賴call,調(diào)用。
?
JS的調(diào)用與執(zhí)行,之前依賴于頁面的事件,比如onload,或者是加載的順序來執(zhí)行。
SPA中只能依賴于調(diào)用,不能依賴于加載的順序來執(zhí)行。
JS的執(zhí)行最好不要依賴于加載完立即執(zhí)行。應該與加載解耦。
執(zhí)行要依賴調(diào)用,不依賴加載。
JS最好是只加載,比如eval(),不調(diào)用內(nèi)部方法。
JS實現(xiàn)文件加載-->eval();與方法調(diào)用-->call_fun()分離。
文件加載-->即eval():不涉及任何的js文件中的代碼。
方法調(diào)用-->即call_fun:這個才會涉及到js文件中的代碼。
JS文件在加載的時候會根據(jù)內(nèi)容進行調(diào)用,但是加載代碼的時候也可以不調(diào)用。
故代碼最好不要有調(diào)用,這樣就可以加載即執(zhí)行與調(diào)用分離。
邊加載邊執(zhí)行,調(diào)用也會執(zhí)行代碼,最好是代碼不要有調(diào)用的內(nèi)容。
代碼執(zhí)行后再調(diào)用。順序加載并執(zhí)行與調(diào)用分離。執(zhí)行時可以不用關心js文件里的代碼,調(diào)用時才關心js文件的代碼。
===>代碼中不要有調(diào)用,不然在加載并執(zhí)行時會去調(diào)用代碼內(nèi)容,調(diào)用會改變邏輯或者數(shù)據(jù)。
這樣就可以在加載并執(zhí)行時不用關心代碼中的業(yè)務邏輯,因為此時不會調(diào)用代碼。
加載并執(zhí)行時或者eval()執(zhí)行時,不要調(diào)用代碼邏輯。
就是說代碼中不要有直接調(diào)用的代碼,否則在加載執(zhí)行時會調(diào)用。而應通過其他方式來調(diào)用。不要直接調(diào)用,否則在加載執(zhí)行時會調(diào)用。
?
加載并執(zhí)行時其實是和代價有關系的,如果代碼中沒有直接的調(diào)用,那么是不會去調(diào)用,否則就會調(diào)用。
?
加載是和代碼內(nèi)容有關系,代碼中不要有調(diào)用的部分。加載時會執(zhí)行js代碼,但是不要有調(diào)用會改變代碼邏輯。
?
?
加載并執(zhí)行時不要改變代碼邏輯,不要有調(diào)用會改變代碼邏輯。
?
以上部分不需要去看具體的代碼邏輯,只需要關心文件的加載即可。
?
接下來就需要關心代碼的調(diào)用,代碼邏輯的改變。需要看代碼的邏輯。-------->即看代碼。上面的加載并執(zhí)行可以不要看代碼里的邏輯,因為加載并執(zhí)行時并不會調(diào)用代碼,來改變代碼邏輯。
之所以加載并執(zhí)行時會阻塞下面HTML的渲染,是因為執(zhí)行js可能會調(diào)用代碼改變代碼邏輯。
?
?
如何看懂script.js file里的業(yè)務流程,結構。
結構:順序,選擇,循環(huán)
流程:輸入數(shù)據(jù)(對象)----->輸出數(shù)據(jù)(對象)。
通常是輸入?yún)?shù),輸出參數(shù),業(yè)務流程即數(shù)據(jù)流向。
不管數(shù)據(jù)有多少,通常會從輸入?yún)?shù),經(jīng)過多次中間參數(shù),形成最終的一個參數(shù)或者數(shù)據(jù)。
?
數(shù)據(jù)要么輸入?yún)?shù)-------->相當于賦值給輸出參數(shù),要么是賦值。
?https://github.com/maxzhang/maxzhang.github.com/issues/8
?
https://github.com/zhaoda/spa
?
每個screen都是獨立的,與其他screen是無關的,獨立的,分離的。數(shù)據(jù)要獨立,分離。
從這個角度來看待SAO項目就可以比較好理解了。
每個loadscreen中的init方法要獨立,不依賴screen以外的js。
?
?
?
總結
- 上一篇: web漏洞扫描器-appscan
- 下一篇: 我没有时间 I Don't Have T