2012-09-22 52 views
2

我在how external scripts block the UI thread上看过这篇不错的文章,但是我不清楚阻塞是由于<script>标签还是src='/myscript.js' src属性的存在。内联JavaScript阻止UI线程?

我的问题是确实内嵌的JavaScript(缺少src属性的声明),例如这样的:

<script type='text/javascript'> alert('am i blocking too?');</script> 

或本:

<script type='text/javascript'> var php='<?=json_encode($myObj)?>';</script> 

也阻止用户界面线程?

+3

警报()将阻止的事情,直到它承认,无论你把它的。 –

+0

好的,如果我只是做一些对象或者做一些其他的函数调用而不是提醒某些事情呢?也许你可以回答这个问题,说明什么是块,什么不是? –

+1

内联JS和'src'都会在遇到AFAIK时执行JS时阻塞UI线程。尝试在PHP中回显一个JS文件,头部睡眠时间为5秒,页面在加载脚本之前不会呈现。 –

回答

5

JS文件或任何 JS任何执行的任何负载(无论是在外部文件或内联)会阻止UI线程。

<script>标记的异常是异步加载,脚本将在后台加载并异步执行。

还有一些“延迟”加载(即defer属性),它告诉浏览器在页面的其余部分加载之前不要实际执行其中的JS。

+1

而延迟加载可以通过HTML5的'async'属性或者通过将脚本元素动态添加到body标签的末尾来实现。 –

+0

@FabrícioMatté实际上它是'defer'属性。 – Alnitak

+0

'defer'和'async'属性有什么区别?我无法理解要使用的案例。 –

0

alert()或任何其他提示操作将阻止该线程,直到用户响应提示。无论他们在哪里......

更新(有关评论):

一个浏览器窗口解析HTML和运行JS用一个单独的线程..在JavaScript代码所以任何需要时间完成后会阻塞线程..不管它是什么。它可以是一个alertAJAX Request或其他任何东西..

+0

也许你可以扩展你的答案,以澄清什么块与什么不阻止?只是声明对象阻塞?像这样 - >'' –

+0

@timpeterson查看更新 –

2

web workers之外,它们是它们自己的野兽,将HTML网页和相关的Javascript视为单线程[1]。

因此,如果任何 JavaScript正在页面上运行,则整个用户界面将被阻止。诸如window.alert(),window.confirm()window.prompt()之类的东西会阻塞整个UI直到它们被清除,但即使是无限循环也会冻结浏览器窗口[2],直到它完成。

编辑 - 基于评论和编辑的问题:

在原来的问题提供不指执行Javscript的运行链路,但同步 VS 异步 Javscript加载的性质。我会给你一个例子,说明为什么会出现这种阻塞。

在Javscript的回归日子里,功能document.write()是让Javascript与网页互动的唯一方法。因此,当网页遇到加载Javascript文件的请求时,浏览器必须暂停其他所有操作 - 以防JavaScript文件使用document.write向流中注入某些内容。

在当今世界,这并没有发生太多的事情,所以浏览器给页面设计者一种说法,“我保证这个Javascript文件并不关心它何时加载,它不会使用document.write()或任何东西其他棘手。在完成之前,您不必冻结。

这就是为什么现代Web浏览器具有deferasync属性的原因。

  1. Opera很特别,但我们会忽略它的。
  2. 或者整个浏览器,这取决于
+0

我不认为歌剧是一个特例,因为它并没有真正做出不同的实质性的东西。同步WebWorker事件不是这个问题的一部分:-) – Bergi

+0

@Bergi - Opera不像浏览器那样冻结UI。事实上,在Opera下,您可以看到一些DOM操作在发生时实时发生。最初的问题不清楚OP究竟在阻止哪种类型的阻止。 –