作者sk1765 (鼎玉鉉)
看板Ajax
標題Re: [討論] javascript是共時、多執行緒嗎?
時間Mon Nov 7 14:06:32 2011
為了確認同一個頁面多個iframe也只有一個thread
我剛實測了同一個頁面兩個iframe 裡面各自跑timer
兩個iframe同時去更新父視窗
還是用原來的12一組 34一組
測試結果 12 34不會交叉出現 13 24 或14 32都不會出現
tyx的說法是正確的 不管ie,ff,chrome,opera都只有一個thread
所以opera的文件?? 不了解是不是他們自己也寫錯
程式連結:
http://www.briantest.site88.net/test.html
程式如下:
test.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"
http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="
http://www.w3.org/1999/xhtml" lang="zh-TW" xml:lang="zh-TW">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>iframe multithread?</title>
<script>
i = 0;
</script>
</head>
<body>
<div id='show'></div>
<iframe src='test1.html'></iframe>
<iframe src='test2.html'></iframe>
</body>
</html>
--------------------------------------------------------------
test1.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"
http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="
http://www.w3.org/1999/xhtml" lang="zh-TW" xml:lang="zh-TW">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>iframe1</title>
<script>
var s=null,t1=null;
window.onload = function(){
s = parent.document.getElementById('show');
t1 = setInterval( A ,1);
}
function A() {
var x = window.parent.document.createTextNode('1');
s.appendChild(x);
var y = window.parent.document.createTextNode('2');
s.appendChild(y);
window.parent.i++;
if (window.parent.i>=1000) {
clearInterval(t1);
}
if (window.parent.i%10==0)
s.appendChild(window.parent.document.createElement('br'));
}
</script>
</head>
<body>
</body>
</html>
----------------------------------------------------
test2.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"
http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="
http://www.w3.org/1999/xhtml" lang="zh-TW" xml:lang="zh-TW">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>iframe2</title>
<script>
var s=null,t2=null;
window.onload = function(){
s = parent.document.getElementById('show');
t2 = setInterval( B ,2);
}
function B() {
var x = window.parent.document.createTextNode('3');
s.appendChild(x);
var y = window.parent.document.createTextNode('4');
s.appendChild(y);
window.parent.i++;
if (window.parent.i>=1000) {
clearInterval(t2);
}
if (window.parent.i%10==0)
s.appendChild(window.parent.document.createElement('br'));
}
</script>
</head>
<body>
</body>
</html>
所以我們就當alert是一個特例吧 我在opera ff 都看到兩個A疊在一起
不知道這算不算bug
有錯請指教
※ 引述《tyx (?????????????????)》之銘言：
: 在同一個 page 裡 只有一個 thread 在執行
: 不管有幾個 iframe 都一樣 (但 Opera 不是 推文有連結)
: 那為何有不同的行為
: 我以 senser 的範例作說明
: 1. FireFox
: 當 FF 執行 $('ifa').src = 'javascript:alert("A");alert("B")'; 時
: 會先 parse 這段 javascript 但並不會立刻執行此 js
: 而是產生一個 '要執行此 js 的 event'（暫時稱為 event1） 在 event queue 裡
: 之後執行下一行 $('ifb').src = ... 並產生 event2
: 然後 thread 回去 event queue 取到 event1 並執行 alert("A")
: 此時會看到 alert("A") 的 dialog
: 此 dialog 出現時 除了此 dialog 以外 page 的 input 都會被 disabled
: 所以不會有其他 UI events
: 當 alert("A") dialog 執行時 內部也有個 event loop 在取 event 出來執行
: 所以會取到 event2 並執行 alert("C")
: 當你按掉 alert("C") 之後 會立刻執行 alert("D")
: 再按掉 alert("D") 又會回到 alert("A") 的內部 event loop
: 再按掉 alert("A") 之後 會執行 alert("B")
: 所以會看到 alert("A") 出現後 立刻出現 alert("C")
: 然後結束 alert("C") 立刻出現 alert("D")
: 然後結束 alert("D") 回到 alert("A")
: 然後結束 alert("A") 立刻出現 alert("B")
: 2. IE
: 當 IE parse 完 js 之後會立刻執行 所以才會
: 出現 A 按掉A之後出現 B 按掉 B 之後出現 C 按掉 C 之後出現 D
: ps: 至於 console.log("A") 會依序出現
: 是因為執行 console.log("A") 時
: 並不會偷偷跑 event loop
: 所以 C D 不會偷跑囉
: ※ 引述《senser (彷彿曾經一起死過)》之銘言：
: : alert在不同thread下(iframe)到底會怎樣我倒是沒有研究過
: : 我把您的code改成
: : var $ = function(id){return document.getElementById(id);};
: : $('ifa').src = 'javascript:alert("A");alert("B")';
: : $('ifb').src = 'javascript:alert("C");alert("D")';
: : 我剛剛試的結果
: : 意外發現FF下會先出現A(很快來不急按) 然後被C蓋住 之後D 回到A 最後B
: : 這有點兩個alert一起出現的味道(只是被蓋住了)
: : IE的結果就是同一時間只有一個alert 然後ABCD
: : 這跟browser的實作有關
: : 我只能推斷 FF的alert出現時 容許其他的thread的alert也出現
: : (不確定是 出現兩個 一個被"蓋住" 或是同一個alert box然後內容被取代
: : 在我的FF中沒辦法用滑鼠移動alert box)
: : 而IE的UI不容許這種情況出現
: : 然後回到問題
: : 在兩個thread併行下 ACBD交叉出現我覺得是有可能的
: : (但我不知道哪個browser可以 也沒試著去製造出來過)
: : 但是在一個event-driven 的single thread中(前篇文章) 是不會發生的
: : 一個callback只會執行完在去執行下一個 不會互相跳來跳去
: : ==============
: : 各家瀏覽器對alert的實作略有不同
: : 一般當alert出現時 產生alert那段程式會暫停 直到按了之後在繼續
: : 然而有些瀏覽器在alert出現時 會繼續dispatch的動作
: : dispatch進去的handler中 如果是UI trigger的 他不會執行
: : 但如果是non-UI 的event handler 像是ajax的callback
: : 在某些browser中是會同時執行的 即使你的alert還掛在那裏
: : 所以用alert debug的習慣是非常不好的
: : 在你還沒按下時 可能有東西就跑起來了
: : 以致於你alert出來的變數也有可能被影響 而看到錯的值
: : 真的用在application中更是有可能造成錯誤 (confirm,prompt等等都一樣)
: : 根據你甚麼時候按下去 你的那段程式才會繼續跑
: : 但是你的non-UI event在背後一樣的dispatch然後fire (如page load,timeout)
: : 所以希望大家改掉直接用這種東西當UI的習慣 避免不必要的timing issue
: : 全部的UI都要自己兜出來比較好
: : ===
: : 這裡就有現成的例子
: : 剛剛用FF看 好像是CDAB (按掉CD時A或若隱若現)
: : 如果你沒有注意那個若隱若現的A 你就會以為他的順序真的是CDAB這樣
: : 然而如果你改成console.log("A")
: : 就會知道他的真正的順序是ABCD
: : 給大家參考:D
--
※ 發信站: 批踢踢實業坊(ptt.cc)
◆ From: 175.182.110.93
※ 編輯: sk1765 來自: 175.182.110.93 (11/07 14:14)
1F：→ weiyucsie:opera的alert可以移開阿XD 11/07 14:19
2F：→ sk1765:我知道阿 但如果只有一個thread 應該是同時只會一個阿 11/07 14:23
3F：→ weiyucsie:老實說，用alert原因是因為可以做到暫停的效果~ 11/07 14:30
4F：→ weiyucsie:比較好控制 11/07 14:32
6F：→ weiyucsie:這時候console.log會在alert之後執行 11/07 14:33
7F：→ weiyucsie:當我把alert的位置放在不同的位置上 11/07 14:34
8F：→ weiyucsie:選任意一個alert按下去，出現對應的console.log 11/07 14:34
9F：→ weiyucsie:只是你說的12和34的情形，測試起來也好像是這樣 11/07 15:14
10F：→ weiyucsie:可能還要確認看看吧 >.< 11/07 15:14
11F：推 tyx:ie ff chrome 在 alert 時 不會跑 event loop 11/07 16:22
12F：→ tyx:所以不會 event 重入 11/07 16:23
13F：→ tyx:勿打 是 ie 與 chrome 11/07 16:24
14F：→ tyx:ie 與 chrome 多個 iframe 也是同一個 thread 11/07 16:24
15F：→ tyx:一個 iframe 先 setTimeout 之後另一個跑無窮回圈 11/07 16:26
16F：→ tyx:此時 timeout 不會執行 若是不同 thread 應該要有 11/07 16:27
17F：→ tyx:timeout 的event 11/07 16:28
18F：→ tyx:也可寫個 plugin 來驗證 看看不同 iframe 11/07 16:29
19F：→ tyx:是不是有相同 thread id 11/07 16:29
20F：→ weiyucsie:剛剛用process explorer查看 chrome果然只有一個XD 11/07 16:38
21F：→ weiyucsie:不過opera也只有一個>.< 11/07 16:40
22F：→ weiyucsie:只是又與我剛剛的實驗結果感覺不太一樣~ 11/07 16:41
23F：推 herb123456:樓上 multi-thread和multi-process不一樣... 11/20 14:48
24F：→ weiyucsie:process explorer有個Thread tab阿 有列出tid... 11/22 22:52