将javascripts组合到一个文件中

时间:2021-05-21 23:33:06

Having read up recently on yahoo's web optimisation tips and using YSlow I've implemented a few of their ideas on one of my sites http://www.gwynfryncottages.com you can see the file here http://www.gwynfryncottages.com/js/gw-custom.js.

最近阅读了雅虎的网络优化提示和使用YSlow我已经在我的一个网站http://www.gwynfryncottages.com上实现了他们的一些想法,你可以在这里看到http://www.gwynfryncottages.com /js/gw-custom.js。

While this technique seems to work perfectly on most occasions, and really does speed up the site, but I do notice a significantly higher number of errors where the javascripts don't load or don't load completely while I'm working on the site so three questions:-

虽然这种技术似乎在大多数情况下都能很好地工作,并且确实加速了网站,但我确实注意到当我在网站上工作时,javascripts没有加载或者没有完全加载的错误数量明显增多所以有三个问题: -

  • is combining scripts this way a good idea at all in terms of reliability?

    在可靠性方面,这样结合脚本是一个好主意吗?

  • is there any way to measure the number of errors i.e. the number of times the script failed to load?

    有没有办法测量错误的数量,即脚本加载失败的次数?

  • is there any way to 'pre-load' the javascript or ensure that the number of loading errors is reduced?

    有没有办法'预加载'javascript或确保减少加载错误的数量?

4 个解决方案

#1


5  

Of course it's good. You will not only decrease HTTP requests but you will cut down delays in downloading other resources.

当然这很好。您不仅可以减少HTTP请求,还可以减少下载其他资源的延迟。

Try using minify: http://code.google.com/p/minify/, I've been using it and I've no complaints.

尝试使用minify:http://code.google.com/p/minify/,我一直在使用它,我没有抱怨。

I can assure you that combining files WON'T cause any errors as a combined script is the same as 10 non-combined scripts, they all load in the same way (In an ordered way, left to right, top to bottom). Double check the way you're combining them.

我可以向你保证,组合文件不会导致任何错误,因为组合脚本与10个非组合脚本相同,它们都以相同的方式加载(按顺序,从左到右,从上到下)。仔细检查您组合它们的方式。

#2


1  

Script execution stops at serious errors. If you have multiple scripts, the others will still run; if you packed everything into one big file, a lot more code won't get executed. So combining scripts is bad for reliability, but can be good for other purposes (mainly load time).

脚本执行在严重错误时停止。如果你有多个脚本,其他脚本仍会运行;如果你将所有内容都打包成一个大文件,那么将会执行更多的代码。因此,组合脚本不利于可靠性,但可以用于其他目的(主要是加载时间)。

All browsers have some sort of javascript console which will show you the number of errors. Most have some sort of developer tool too (Firebug in Firefox, Dragonfly in Opera etc).

所有浏览器都有某种javascript控制台,它会显示错误的数量。大多数人也有某种开发工具(Firefox中的Firebug,Opera中的Dragonfly等)。

I'm not sure what you mean by preloading. Since a javascript file can affect the rest of the page in various ways, browsers will fully load and execute a script tag before continuing to parse the page (which is why scripts can slow page loading down so much).

我不确定你的意思是预装。由于javascript文件可以以各种方式影响页面的其余部分,因此浏览器将在继续解析页面之前完全加载并执行脚本标记(这就是脚本可以减慢页面加载速度的原因)。

#3


0  

I can't see the load function in your code which is being called on your body tag! I'd try and steer clear of adding JS to your HTML file, it can be added dynamically and will prob cause you less hassle along the way aas well as being easier to maintain.

我看不到你的身份标签上调用的代码中的加载函数!我试着避免将JS添加到您的HTML文件中,它可以动态添加,并且可能会让您减少麻烦,并且更容易维护。

I'd say that the things you need to look out for are making sure that you're not trying to call something before it's defined (maybe your seperate JS files were defined in a different order to how they appear in the single JS file).

我要说的是你需要注意的事情是确保你在定义它之前没有尝试调用某些东西(也许你的单独JS文件的定义方式与它们在单个JS文件中的出现方式不同) 。

Firebug for firefox is a good development tool, if you've not found it already. Webkit, Opera and IE also have various other dev tools.

Firefox的firebug是一个很好的开发工具,如果你还没有找到它。 Webkit,Opera和IE还有各种其他开发工具。

#4


0  

Combining JavaScript files is always the best way to go, unless it's not logically sane to do so (downloading jQuery from Google Code instead of hosting it yourself is a good example).
I always combine as many files as I can (JavaScript, CSS, images (CSS Sprites), etc.), also in development, and I never experience any problems. It's way faster regarding less http connections, which should not in any case be underestimated.

组合JavaScript文件总是最好的方法,除非它在逻辑上不合理(从谷歌代码下载jQuery而不是自己托管它是一个很好的例子)。我总是尽可能多地组合文件(JavaScript,CSS,图像(CSS Sprites)等),也在开发中,我从来没有遇到任何问题。对于较少的http连接,这种方式会更快,在任何情况下都不应低估它们。

Regarding that you want to count the errors, I don't exactly see what you mean. But, debugging tools like the built in one in Google Chrome or Firebug for Firefox are good tools for debugging your JavaScript code, and shows lists of the errors occurring.

关于你想要计算错误,我并不完全明白你的意思。但是,调试工具(如Google Chrome中的内置工具或Firebug for Firefox)是调试JavaScript代码的好工具,并显示发生错误的列表。

And to that thing of preloading: Yes, it can be done, though it'll become nasty and illogical. However, I can't think of any case whatsoever where it would be a good solution to have the trouble to preload the JavaScript, compared to just make it work right out of the box, no error checking needed.

对于那个预加载的东西:是的,它可以做到,虽然它会变得讨厌和不合逻辑。但是,我无法想到任何情况下,如果只是让它可以直接加载JavaScript,那么这将是一个很好的解决方案,而不需要进行错误检查。

About the error you are experiencing, the only one that my Chrome points out is this:

关于您遇到的错误,我的Chrome指出的唯一一个错误是:

Uncaught ReferenceError: load is not defined

... which seems to be the onload method "load()" set on line 55 of your HTML document when the body tag is started.

...当启动body标记时,似乎是在HTML文档的第55行设置的onload方法“load()”。

#1


5  

Of course it's good. You will not only decrease HTTP requests but you will cut down delays in downloading other resources.

当然这很好。您不仅可以减少HTTP请求,还可以减少下载其他资源的延迟。

Try using minify: http://code.google.com/p/minify/, I've been using it and I've no complaints.

尝试使用minify:http://code.google.com/p/minify/,我一直在使用它,我没有抱怨。

I can assure you that combining files WON'T cause any errors as a combined script is the same as 10 non-combined scripts, they all load in the same way (In an ordered way, left to right, top to bottom). Double check the way you're combining them.

我可以向你保证,组合文件不会导致任何错误,因为组合脚本与10个非组合脚本相同,它们都以相同的方式加载(按顺序,从左到右,从上到下)。仔细检查您组合它们的方式。

#2


1  

Script execution stops at serious errors. If you have multiple scripts, the others will still run; if you packed everything into one big file, a lot more code won't get executed. So combining scripts is bad for reliability, but can be good for other purposes (mainly load time).

脚本执行在严重错误时停止。如果你有多个脚本,其他脚本仍会运行;如果你将所有内容都打包成一个大文件,那么将会执行更多的代码。因此,组合脚本不利于可靠性,但可以用于其他目的(主要是加载时间)。

All browsers have some sort of javascript console which will show you the number of errors. Most have some sort of developer tool too (Firebug in Firefox, Dragonfly in Opera etc).

所有浏览器都有某种javascript控制台,它会显示错误的数量。大多数人也有某种开发工具(Firefox中的Firebug,Opera中的Dragonfly等)。

I'm not sure what you mean by preloading. Since a javascript file can affect the rest of the page in various ways, browsers will fully load and execute a script tag before continuing to parse the page (which is why scripts can slow page loading down so much).

我不确定你的意思是预装。由于javascript文件可以以各种方式影响页面的其余部分,因此浏览器将在继续解析页面之前完全加载并执行脚本标记(这就是脚本可以减慢页面加载速度的原因)。

#3


0  

I can't see the load function in your code which is being called on your body tag! I'd try and steer clear of adding JS to your HTML file, it can be added dynamically and will prob cause you less hassle along the way aas well as being easier to maintain.

我看不到你的身份标签上调用的代码中的加载函数!我试着避免将JS添加到您的HTML文件中,它可以动态添加,并且可能会让您减少麻烦,并且更容易维护。

I'd say that the things you need to look out for are making sure that you're not trying to call something before it's defined (maybe your seperate JS files were defined in a different order to how they appear in the single JS file).

我要说的是你需要注意的事情是确保你在定义它之前没有尝试调用某些东西(也许你的单独JS文件的定义方式与它们在单个JS文件中的出现方式不同) 。

Firebug for firefox is a good development tool, if you've not found it already. Webkit, Opera and IE also have various other dev tools.

Firefox的firebug是一个很好的开发工具,如果你还没有找到它。 Webkit,Opera和IE还有各种其他开发工具。

#4


0  

Combining JavaScript files is always the best way to go, unless it's not logically sane to do so (downloading jQuery from Google Code instead of hosting it yourself is a good example).
I always combine as many files as I can (JavaScript, CSS, images (CSS Sprites), etc.), also in development, and I never experience any problems. It's way faster regarding less http connections, which should not in any case be underestimated.

组合JavaScript文件总是最好的方法,除非它在逻辑上不合理(从谷歌代码下载jQuery而不是自己托管它是一个很好的例子)。我总是尽可能多地组合文件(JavaScript,CSS,图像(CSS Sprites)等),也在开发中,我从来没有遇到任何问题。对于较少的http连接,这种方式会更快,在任何情况下都不应低估它们。

Regarding that you want to count the errors, I don't exactly see what you mean. But, debugging tools like the built in one in Google Chrome or Firebug for Firefox are good tools for debugging your JavaScript code, and shows lists of the errors occurring.

关于你想要计算错误,我并不完全明白你的意思。但是,调试工具(如Google Chrome中的内置工具或Firebug for Firefox)是调试JavaScript代码的好工具,并显示发生错误的列表。

And to that thing of preloading: Yes, it can be done, though it'll become nasty and illogical. However, I can't think of any case whatsoever where it would be a good solution to have the trouble to preload the JavaScript, compared to just make it work right out of the box, no error checking needed.

对于那个预加载的东西:是的,它可以做到,虽然它会变得讨厌和不合逻辑。但是,我无法想到任何情况下,如果只是让它可以直接加载JavaScript,那么这将是一个很好的解决方案,而不需要进行错误检查。

About the error you are experiencing, the only one that my Chrome points out is this:

关于您遇到的错误,我的Chrome指出的唯一一个错误是:

Uncaught ReferenceError: load is not defined

... which seems to be the onload method "load()" set on line 55 of your HTML document when the body tag is started.

...当启动body标记时,似乎是在HTML文档的第55行设置的onload方法“load()”。