Wie viele sind zu viele enthalten in <HEAD>?

Ich habe eine Suche durchgeführt, kann aber keine Best Practice oder Empfehlung finden - und vielleicht liegt es daran, dass es keine gibt. Ich benutze alle Arten von jQuery-Plugins auf meiner Site, zusätzlich zu TinyMCE und einigen anderen Plugins und der JS-Datei meiner Site. Außerdem habe ich drei Stylesheets ..... und es kommt noch mehr, wenn die Seite wächst!Wie viele sind zu viele enthalten in <HEAD>?

Gibt es irgendeine Art von "Limit" oder irgendetwas, das Sie für die Aufnahme von Skripten in das Tag beachten sollten? Ich weiß, dass jeder eine weitere HTTP-Anfrage ist, die abgeschlossen werden muss, aber wenn sie alle minimiert und so klein wie möglich sind, wird es Probleme geben?

<link rel="stylesheet" type="text/css" href="http://mysite.com/assets/css/redmond.css" /> 
    <link rel="stylesheet" type="text/css" href="http://mysite.com/assets/css/style.css" /> 
    <link rel="stylesheet" type="text/css" href="http://mysite.com/assets/css/jqueryFileTree.css" /> 

    <!--[if gte IE 7]> 
     <link rel="stylesheet" type="text/css" href="http://mysite.com/scripts/style.ie.css" /> 
    <![endif]--> 

    <script type="text/javascript" src="http://mysite.com/assets/js/jquery.js"></script> 
    <script type="text/javascript" src="http://mysite.com/assets/js/jquery-ui.js"></script> 
    <script type="text/javascript" src="http://mysite.com/assets/js/jqueryFileTree.js"></script> 
    <script type="text/javascript" src="http://mysite.com/assets/js/jqminmax.js"></script> 
    <script type="text/javascript" src="http://mysite.com/assets/js/jquery.corner.js"></script> 
    <script type="text/javascript" src="http://mysite.com/assets/js/jquery.jeditable.js"></script> 
    <script type="text/javascript" src="http://mysite.com/assets/js/jquery.qtip.js"></script> 

    <script type="text/javascript" src="http://mysite.com/assets/plugins/tinymce/tiny_mce.js"></script> 

    <script type="text/javascript" src="http://mysite.com/assets/js/latitude.js"></script>

Quelle

2009-07-27 Nathan Loding

Ist nicht die Download-Zeit das ganze Limit, das zählt? Was fragst du? Wie langsam ist ein Download zu langsam? –

Ja, die Downloadzeit ist alles was zählt. Aber ich kenne keine Möglichkeit, die JS-Dateien einfach zu kombinieren, und ich frage mich, was die anderen Leute davon halten, wie viele "zu viele" sind. –

Das UNIX-Dienstprogramm 'cat' ist eine gute Möglichkeit, JS-Dateien zu kombinieren. – Quentin

Nicht gut!

Ich würde empfehlen, diese Dateien zu einem js und einem css mit einem Skript vor der Bereitstellung zu leben zu kombinieren. Es gibt viele Gründe, warum dies nicht gut ist, finden Sie in den unten stehenden Link für weitere Informationen:

http://developer.yahoo.com/performance/rules.html

Edit: weiter zu beantworten Nein, es gibt keine Grenzen für die Anzahl von Dateien, aber die meisten Browser können Sie haben nur 2 Verbindungen (für eine Site) zu einem Web Server und laden Ihre js 2 Dateien gleichzeitig. Die YSlow plugin für Firefox zeigt Ihnen eine Grafik, wie Ihre Dateien heruntergeladen werden.

Wenn Sie ASP.NET verwenden, kann dieser codeproject Artikel helfen, wenn Sie auf Linux sind, dann könnte this helfen.

Edit: Eine einfache Batch-Datei auf Windows (Stecker in der Build-Tools)

@echo off 
copy file1.js + file2.js + file3.js merged.js /b

Quelle

2009-07-27 16:04:15 Frozenskys

Wie kombiniere ich die JS-Dateien? Kopieren Sie einfach den gesamten Code in ein riesiges Ding, dann minimieren Sie es? –

C/P nach der Minification sollte auch funktionieren. – millimoose

Zwischen dieser und der YUICompress-Bibliothek denke ich, dass ich in Ordnung sein sollte. Danke für den ganzen Input! –

Je mehr CSS- und JS-Dateien Sie auf einer Seite referenzieren, desto länger dauert das Laden. Es ist viel besser, sie in so wenige Dateien wie möglich zu kombinieren.

Quelle

2009-07-27 16:00:42 Eifion

Viele Browser öffnen 2 gleichzeitige Verbindungen zum Server und paralellisieren das Herunterladen. Es gibt Tricks, wie man Inhalte auf anderen Domains/Subdomains speichern kann, um den Browser dazu zu bringen, mehr als diese 2 Verbindungen einzurichten, um Dateien herunterzuladen. Es ist ein Gleichgewicht zwischen Größe und Anzahl der Dateien. – nos

Wenn es Ihnen hilft, sich besser zu fühlen, werden viele andere Seiten so "geladen" und js-Dateien werden von allen modernen (und sogar alten) Browsern im Cache gespeichert. Eine Sache könnte helfen, Ihre jquery-Datei mit einer auf der googleapis-Site gehosteten Seite zu verknüpfen, da die Möglichkeit besteht, dass eine andere Website dieselbe jquery-Datei hostet und sich bereits im Cache befindet:

http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js

Ihr Webserver sollte bereits Dateien optimieren, indem Sie automatisch die gzip-Komprimierung aktivieren, aber überprüfen Sie dies, um sicherzugehen.

Quelle

2009-07-27 16:01:58

Es wird immer noch sehr langsam auf "cold cache" lädt z. erster Besuch. Und es gibt Daten von Yahoo, die sagen, dass ein hohes Alter der Seitentreffer Cold Cache sind. – Frozenskys

wäre, weiß ich nicht, ob es für diese Art von Frage eine gute Antwort gibt, aber wenn Sie sind an Optimierung interessiert, es gibt eine ganze Reihe von ihnen von Yahoo !: http://developer.yahoo.com/performance/rules.html getan.

Persönlich tendiere ich dazu, die meisten dieser Regeln zu ignorieren, einfach weil die Art von Dingen, die ich baue, nicht so groß sind.

Quelle

2009-07-27 16:05:03 JHollanti

Browser haben ein Limit für die Anzahl gleichzeitiger Anfragen an eine Domain, so dass sie das Laden anderer Elemente auf Ihrer Seite verlangsamen können. Zum Beispiel IE8 has a limit of 6 concurrent connections, and IE7 has a limit of 2.

Ich würde empfehlen, die Dateien, die Sie lokal hosten, extern (z. B. bei Google) zu referenzieren und andere möglicherweise an den unteren Rand der Seite zu verschieben, damit sie den Ladevorgang nicht verzögern.

Sie können Skripte mit vielen Online-Tools wie jsCompress kombinieren. Es hat einen "Upload Files" -Reiter, so dass Sie einfach alle Ihre js-Dateien hochladen können und es komprimiert und verkleinert.

Es gibt auch serverseitige Dienstprogramme, die das für Sie erledigen. Sie sagen nicht, welche Server-Side-Technologie Sie verwenden, aber zum Beispiel in der PHP-Welt können Sie Minify verwenden.

Quelle

2009-07-27 16:08:08

Google Page Speed ist dein Freund. Scheint grundsätzlich YSlow auf Steroiden zu sein.

Quelle

2009-07-27 16:13:05 millimoose

Wie viele sind zu viele enthalten in <HEAD>?

Antwort

Verwandte Themen