【记录】尝试分析网站加载swf的flash速度慢的原因

【背景】

一个网站:

http://www.qiandangu.com/

主页打开很慢。

所以去分析分析为何打开慢。

参考之前的折腾:

【记录】用tracert等工具分析网站访问速度慢的原因

中提到的:

http://gtmetrix.com/

去分析看看到底页面载入是哪里慢。

结果显示出,是对应的swf的flash加载速度太慢:

speed slow for load swf

总共加载时间10秒多,单独这个mf.swf就花了8秒多。

所以就去分析,为何会这么慢。

以及如何解决。

【解决过程】

1.至于为何慢。

网上搜了下,一些参考:

flash网站,怎样控制swf大小呢,因为直接影响加载速度

得知,貌似本身swf的flash,加载都很慢。

加上本身的确是400多KB,所以本身文件就很大,也就加载慢了。

2.现在想办法,看看能否找到解决办法。

后来参考:

Flash swf loading very slowly on website

其实说,把:

<!-- Flash Menu -->
        <div id="flash_menu">
	        <script src="scripts/swfobject_modified.js" type="text/javascript"></script>
			<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="922" height="312" id="FlashID" title="menu">
				  <param name="movie" value="resources/menu/menu_en.swf" />
				  <param name="quality" value="high" />
				  <param name="wmode" value="opaque" />
				  <param name="swfversion" value="6.0.65.0" />
			  <!-- This param tag prompts users with Flash Player 6.0 r65 and higher to download the latest 
                   version of Flash Player. Delete it if you don’t want users to see the prompt. -->
				  <param name="expressinstall" value="scripts/expressInstall.swf" />
			  <!-- Next object tag is for non-IE browsers. So hide it from IE using IECC. -->
			  <!--[if !IE]>-->
			<object type="application/x-shockwave-flash" data="resources/menu/menu_en.swf" width="922" height="312">
		      <!--<![endif]-->
			    <param name="quality" value="high" />
			    <param name="wmode" value="opaque" />
			    <param name="swfversion" value="6.0.65.0" />
			    <param name="expressinstall" value="scripts/expressInstall.swf" />
		      <!-- The browser displays the following alternative content for 
                   users with Flash Player 6.0 and older. -->
		    <div>
		      <h4>Content on this page requires a newer version of Adobe Flash Player.</h4>
		      <p><a href="http://www.adobe.com/go/getflashplayer">
              <img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" 
              alt="Get Adobe Flash player" width="112" height="33" /></a></p>
		    </div>
		    <!--[if !IE]>-->
		  </object>
		  <!--<![endif]-->
		</object>
		<script type="text/javascript"><!-- 
		swfobject.registerObject("FlashID");
		//--> </script>
        
        </div> <!-- end flash_menu div -->

换成:

<object type="application/x-shockwave-flash" data="resources/menu/menu_en.swf" width="922" height="312">
<param name="movie" value="resources/menu/menu_en.swf">
</object>

即,其中没有那个wmode的:

<param name="wmode" value="opaque" />

 

3.然后去看看此处的html代码:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>千石谷</title>
<style type="text/css">
body,td,th {
	font-size: 12px;
}
#container{ width:1000px; margin:0px auto;}
</style>
<script src="Scripts/swfobject_modified.js" type="text/javascript"></script>
</head>

<body>
<div id="container">
<object id="FlashID" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="1024" height="700">
    <param name="movie" value="mf.swf" />
    <param name="quality" value="high" />
    <param name="wmode" value="opaque" />
    <param name="swfversion" value="6.0.65.0" />
    <!-- 此 param 标签提示使用 Flash Player 6.0 r65 和更高版本的用户下载最新版本的 Flash Player。如果您不想让用户看到该提示,请将其删除。 -->
    <param name="expressinstall" value="Scripts/expressInstall.swf" />
    <!-- 下一个对象标签用于非 IE 浏览器。所以使用 IECC 将其从 IE 隐藏。 -->
    <!--[if !IE]>-->
    <object type="application/x-shockwave-flash" data="mf.swf" width="1024" height="700">
      <!--<![endif]-->
      <param name="quality" value="high" />
      <param name="wmode" value="opaque" />
      <param name="swfversion" value="6.0.65.0" />
      <param name="expressinstall" value="Scripts/expressInstall.swf" />
      <!-- 浏览器将以下替代内容显示给使用 Flash Player 6.0 和更低版本的用户。 -->
      <div>
        <h4>此页面上的内容需要较新版本的 Adobe Flash Player。</h4>
        <p><a href="http://www.adobe.com/go/getflashplayer"><img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="获取 Adobe Flash Player" /></a></p>
      </div>
      <!--[if !IE]>-->
    </object>
    <!--<![endif]-->
  </object>
</div>
<script type="text/javascript">
swfobject.registerObject("FlashID");
</script>
</body>
</html>

然后,根据那人推荐的,应该把:

<object id="FlashID" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="1024" height="700">
    <param name="movie" value="mf.swf" />
    <param name="quality" value="high" />
    <param name="wmode" value="opaque" />
    <param name="swfversion" value="6.0.65.0" />

改为:

<object type="application/x-shockwave-flash" data="mf.swf" width="1024" height="700">
    <param name="movie" value="mf.swf" />
    <param name="quality" value="high" />
    <param name="swfversion" value="6.0.65.0" />

或许会有效果。

4.然后也顺便去查了查wmode,找到:

不建议设置flash的wmode及wmode解释

也是不推荐用wmode的。

5.后来,继续参考:

‘swfobject’ is undefined in IE when using a swf

swfobject.registerObject("FlashID");

等等,最后觉得,应该改为:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    <title>千石谷</title>
    <style type="text/css">
    body,td,th {
        font-size: 12px;
    }
    #container{ width:1000px; margin:0px auto;}
    </style>

</head>

<body>
    <div id="container">
        <object type="application/x-shockwave-flash" data="mf.swf" width="1024" height="700">
            <param name="movie" value="mf.swf" />
            <param name="quality" value="high" />
            <param name="swfversion" value="6.0.65.0" />
            <!-- 此 param 标签提示使用 Flash Player 6.0 r65 和更高版本的用户下载最新版本的 Flash Player。如果您不想让用户看到该提示,请将其删除。 -->
            <param name="expressinstall" value="Scripts/expressInstall.swf" />
            <!-- 浏览器将以下替代内容显示给使用 Flash Player 6.0 和更低版本的用户。 -->
            <div>
                <h4>此页面上的内容需要较新版本的 Adobe Flash Player。</h4>
                <p>
                    <a href="http://www.adobe.com/go/getflashplayer">
                        <img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="获取 Adobe Flash Player" />
                    </a>
                </p>
            </div>
        </object>
    </div>
</body>
</html>

才对。

 

【总结】

待后续测试效果如何再说。



发表评论

电子邮件地址不会被公开。 必填项已用*标注

无觅相关文章插件,快速提升流量