为什么内置页框这么慢?

2023-09-10 16:06:23 作者:僅有旳幸福

我有长一点问题要问你 - 但希望答案是非常简单的:)

I have little bit longer question for you - but hope answer will be very simple :)

比方说,我有一个链接和IFRAME(只是简单的例子)很简单的页面。

Let's say I have very simple page with link and iframe (just for simple example).

<body>
    <a href="test.html" target="mframe">open link></a>
    <iframe name="mframe" [params] />
</body>

所以,当你点击链接它会加载的test.html在框架中。

So when you click on the link it will load test.html in the frame.

现在我会改变与股利和Ajax调用的iframe。

Now I will change the iframe with div and ajax call.

<body>
    <a href="doAjaxCall('test.html')">open link</a>
    <div id="main-content"></div>
</body>

在doAjaxCall将只使用GET AJAX requset让整个响应,解析它(使用JavaScript),并与&lt抢内容;身体GT;标签,放入主content.innerHTML。

The doAjaxCall will simply use GET ajax requset to get whole response, parse it (using JavaScript) and grab content in <body> tag and put it into main-content.innerHTML.

test.html中含有大量的HTML,也CSS样式(但一样都在父页面 - 所以我不,当我使用Ajax解决方案需要他们)

test.html contains a lot of html, also css styles (but the same as are on parent page - so I don't need them when I'm using ajax solution).

问:

这是为什么AJAX的解决方案,以便更快?我还在下载数据同样数量(下载整个的test.html)。

Why is this ajax solution SO faster? I'm still downloading the same amount of data (downloading whole test.html).

为什么iframe的解决方案,那么慢?是不是因为浏览器必须重新分析所有可能的风格?还是有内置页框的其他开销?

Why is the iframe solution so slow? Is it because of browser have to parse all possible styles again? Or is there any other overhead of iframes?

推荐答案

您是pretty的多少在正确的轨道。内置页框将要慢得多,因为存在该浏览器的附加开销(渲染它,维持它的实例,引用它)。

You are pretty much on the right track. iframes are going to be slower because there is an additional overhead for the browser (rendering it, maintaining it's instance and references to it).

AJAX调用将是快了些,因为你得到的数据,你再注入,或者做任何你想做的事情。该IFRAME需要建立在浏览器内存中一个全新的页,然后将其放置在页面上。

The ajax call is going to be a bit faster because you get the data in and you then inject it, or do whatever you want with it. The iframe will need to build an entirely new "page" in the browsers memory, and then place it in the page.

相关推荐