2010-05-09 94 views
3

最近閱讀了雅虎的網頁優化技巧和使用YSlow,我在我的一個網站http://www.gwynfryncottages.com上實現了他們的一些想法,您可以在這裏看到文件http://www.gwynfryncottages.com/js/gw-custom.js將javascripts合併到一個文件中

雖然這種技術似乎在大多數情況下都能很好地工作,並且確實可以加快網站的運行速度,但是我注意到一些數量明顯較多的錯誤,其中javascripts無法加載或者無法完全加載在這個網站上工作,所以有三個問題: -

  • 這種方式組合腳本在可靠性方面是一個好主意?

  • 是否有任何方法來測量錯誤的數量,即腳本未能加載的次數?

  • 是否有任何方法來'預加載'javascript或確保加載錯誤的數量減少?

+0

這是一個helluva腳本文件。你有一些證據,它們可能會給一些限制器帶來問題,但你總是可以使用一個只刪除空格和註釋的應用程序,它仍然會從你的文件中減少相當數量。縮小代碼通常是安全的,它不應該擔心它的一些已經縮小。 – aaaaaaaaaaaa 2010-05-10 00:00:32

回答

5

當然很好。您不僅會減少HTTP請求,還會減少下載其他資源的延遲。

嘗試使用縮小:http://code.google.com/p/minify/,我一直在使用它,我沒有抱怨。

我可以向你保證,組合文件不會導致任何錯誤,因爲組合腳本與10個非組合腳本相同,它們都以相同的方式加載(按照有序方式,從左到右,從上到下底部)。仔細檢查你的組合方式。

+0

我對縮小大文件的擔心在於它的組件已經縮小 - 第二次做這件事不會導致更多的問題,而不會造成更多的問題?谷歌網頁速度確實推薦它,但我注意到它還建議縮小它自己的ga.js文件! – toomanyairmiles 2010-05-09 23:02:06

+0

我*愛*縮小。我在我的web應用程序http://my.perqworks.com上使用它 - 作爲一個自我癡迷的性能調整工具,合併,縮小和緩存我的http資源只是感覺很棒。 – 2010-05-09 23:02:14

+0

我知道你對調整性能有什麼意義,它確實留下餘輝,但是你需要做多少瀏覽器測試? – toomanyairmiles 2010-05-09 23:06:15

0

我看不到你的代碼中正在調用你的身體標記的加載函數!我會盡量避免將JS添加到您的HTML文件中,它可以動態添加,並且可能會導致您在此過程中更輕鬆,也更易於維護。

我想說,你需要注意的事情是確保你沒有試圖在定義它之前調用某些東西(也許你的單獨的JS文件是以不同的順序定義的,以便它們如何出現在單個JS文件)。

firebug for firefox是一個很好的開發工具,如果你還沒有找到它的話。 Webkit,Opera和IE也有各種其他開發工具。

+0

身體標記中的onload是Google地圖的一個鉤子,它在站點和大多數博客條目的某些頁面上使用,對於實用目的,它最終在頭部包含整個站點,因爲我無法獲取它以其他方式工作。 我玩過的文件的順序相當廣泛,目前看起來效果最好 - 有沒有特別注意到的東西? – toomanyairmiles 2010-05-09 23:05:08

1

腳本執行在嚴重錯誤時停止。如果你有多個腳本,其他腳本仍然可以運行;如果你把所有東西都打包成一個大文件,那麼更多的代碼不會被執行。所以組合腳本對可靠性不利,但可以適用於其他目的(主要是加載時間)。

所有瀏覽器都有某種javascript控制檯,它會告訴你錯誤的數量。大多數也有某種開發工具(Firefox中的Firebug,Opera中的Dragonfly等)。

我不確定你的意思是預加載。由於JavaScript文件可以以各種方式影響頁面的其餘部分,因此瀏覽器將在繼續解析頁面之前完全加載並執行腳本標記(這就是爲什麼腳本可以減慢頁面加載速度的原因)。

+0

我是一個設計師類型而不是編碼器,所以我一直在考慮圖片預加載,並想知道在JavaScript世界中是否存在類似的東西。除此之外,我正在考慮將腳本放在頁面底部等,並想知道它是否可行。 – toomanyairmiles 2010-05-09 23:00:04

0

結合JavaScript文件是總是要走的最好的方式,除非它不符合邏輯理智(從Google Code下載jQuery而不是自己託管它是一個很好的例子)。
我總是儘可能多地組合文件(JavaScript,CSS,圖像(CSS Sprites)等)。),也在開發中,我從來沒有遇到任何問題。對於較少的http連接,速度更快,但不應低估這種連接。

關於你想要計算錯誤,我不完全明白你的意思。但是,諸如Google Chrome或Firebug for Firefox中內置的調試工具是調試JavaScript代碼的好工具,並顯示發生錯誤的列表。

對於預加載:是的,它可以完成,雖然它會變得討厭和不合邏輯的。 但是,我想不出任何情況什麼哪裏是一個很好的解決方案,有困難來預加載JavaScript,相比之下,只是使它開箱即用,不需要錯誤檢查。

關於您所遇到的錯誤,我的瀏覽器指出只有一個是這樣的:

Uncaught ReferenceError: load is not defined 

...這似乎是在onload方法「的load()」設置的55行的當body標籤啓動時的HTML文檔。

+0

就計數錯誤而言,我的意思是加載錯誤,文件未能完全加載的次數,onload是谷歌地圖的掛鉤,由於維護原因,它在頭文件包含文件中結束,因爲它在很多頁面上都需要錯誤不是問題而是缺少問題。 – toomanyairmiles 2010-05-09 23:10:20