Uiten van IT

Onder andere JavaScript's aan de onderkant van de HTML-document

Als u niet beschikt over document.write (of een dynamische generatie van de pagina-inhoud gebruik van javascripts) om een ​​deel van de inhoud van de pagina in te voegen in uw scripts, verplaats het script include-instructie aan de onderkant van de pagina, voor het einde van de BODY tag.
De HTTP/1.1 specificatie suggereert dat browsers downloaden niet meer dan twee componenten in parallel per hostname. Als u uw afbeeldingen dienen van meerdere hostnamen, kunt u meer dan twee downloads voor te komen in parallel. Terwijl een script downloaden, echter, zal de browser niet starten een andere downloads, zelfs op verschillende hostnames.
Er zijn ook manieren om dynamisch te maken SCRIPT nodes en load remote scripts nadat de pagina is geladen met behulp van AJAX.

Externaliseren u JavaScript's

Met behulp van externe JavaScript-bestanden zal resulteren in een snellere laden van pagina's, omdat de JavaScript-bestanden in de cache van de browser. Inline JavaScript's "in HTML-documenten te downloaden elke keer als het HTML-document wordt aangevraagd. Dit zou in feite het aantal gemaakte HTTP-verzoeken, maar nadien neemt de grootte van het HTML-document. Externe JavaScript's worden gecached door de browser, de grootte van het HTML-document wordt verminderd, zonder toename van het aantal HTTP-verzoeken.
Houdt u er rekening mee dat, als gebruikers op uw site meerdere bekeken pagina's per sessie en veel van uw pagina's hergebruik van dezelfde scripts en stylesheets, is er een groter potentieel voordeel van externe bestanden in de cache.

Pak je JavaScript-bestanden

In het geval van JavaScripts, in tegenstelling tot CSS, kunnen de bestanden kraakte met behulp van enkele standaard-algoritmen die een kleinere bestandsgrootte dan alleen het verwijderen van spaties of tabs zou geven. Een voorbeeld van javascript verpakker kan hier gevonden worden http://dean.edwards.name/packer/

Zich te ontdoen van het duplicaat Scripts

Het is zeer ongebruikelijk dat hele scripts kunnen worden gedupliceerd, maar een herziening van de tien top Amerikaanse websites laat zien dat twee van hen een dubbel script bevatten. Dupliceren scripts maar uiteraard vermindert de prestaties door het creëren van onnodige HTTP-verzoeken en verspilling van JavaScript-uitvoering.
Ook in veel gevallen, maar de scripts namen verschillen, is er een kans van dubbele scripts binnen dezelfde pagina te wijten aan het team grootte en het aantal van de scripts.

Een minimum te beperken de toegang tot DOM-elementen waar mogelijk

Toegang tot DOM-elementen met JavaScript is langzaam zo om tot een meer responsieve pagina hebben, dient u:
• Cache verwijzingen naar elementen toegankelijk
• Update nodes "offline" en dan voeg ze toe aan de boom
• Vermijd bevestiging lay-out met JavaScript

Apart gedrag van inhoud en presentatie

Net zoals we aparte presentatie (CSS / XSLT) van Content (XHTML / XML), moeten we ook aparte gedrag (Javascript). Dit heet onopvallend Javascript. Net zoals we verwijzen naar externe CSS-bestanden, moeten we verwijzen naar externe JavaScript-bestanden.

In plaats van hard te coderen gedrag in de inhoud (bv. onmouseover, onclick, enz.), moet het gedrag van dynamisch worden toegevoegd aan elementen, klassen, en de unieke elementen (ID's) met behulp van de DOM. De fundamentele document, de inhoud, zou moeten bevatten alleen geldig XHTML / XML en geen javascript.
Javascript moet verhogen door het toevoegen van content gedrag. De inhoud moet blijven nuttig en bruikbaar zonder javascript (of zonder volledige JavaScript-ondersteuning).

Ik heb gered dit artikel eeuwen terug, dus Sorry! Ik dont herinner me de bron ... maar het leek me nuttig, voor ons die op de hoogte over het publiek voor wie wij de ontwikkeling van de site voor ... dus even i

Pagina gewicht kan worden gebruikt om de downloadtijd voor een bepaalde pagina op een verscheidenheid van Internet-verbinding snelheid te bepalen. Bij wijze van voorbeeld, de volgende tabel toont de te downloaden tijden voor drie verschillende pagina's op een aantal populaire verbindingssnelheden.

Voordelen van het verminderen van pagina gewicht?

Het positieve effect van het verminderen van het gewicht pagina komt zowel website-eigenaren en consumenten. Mogelijke voordelen zijn:

1. Pagina's sneller te laden. De meest voor de hand liggende impact van het verminderen van pagina gewicht is dat uw website de pagina's zullen sneller laden voor bezoekers, ongeacht hun verbindingssnelheid.
2. Lagere pagina te laden keer voor een aangenamere bezoekers. Bezoekers zijn minder snel gefrustreerd en elders te gaan als uw pagina's snel te laden. Aan de andere kant, langzaam ladende pagina's zijn een van de zekerste manieren om bezoekers en potentiële klanten te verliezen.
3. Snellere load-tijden zullen bijdragen tot een grotere conversie. Meer bezoekers op uw site blijven langer. Meer van hen zal uiteindelijk het maken van aankopen, het aanmelden voor uw nieuwsbrief, of boek-markering uw site.
4. Uw merkbeleving zal worden versterkt. Terugkerende klanten en first-time bezoekers zullen meer geneigd zijn om uw site (en zakelijke) beschrijven als "professionele" als uw pagina's snel te laden.
5. Pagina's met schone, vaste code zal vaak beter worden geïndexeerd door zoekmachines natuurlijk.
6. Pagina's geoptimaliseerd zijn voor het gewicht daadwerkelijk kan besparen bandbreedte kosten op high-traffic sites. 100.000 pagina's elk met een gewicht 150 Kb vereist twee keer zoveel bandbreedte van uw ISP dan 100.000 pagina's per gewicht 75 Kb. Voor de ISP's die heffing voor gebruikte bandbreedte of voor de surplussen kan deze vermindering leiden tot aanzienlijke besparingen op bandbreedte kosten.

Overweeg de volgende gegevens, gepubliceerd in een rapport

Zet Stylesheets aan de top

Als u een pagina geleidelijk laden, dat is, willen we de browser weer te geven wat de inhoud is zo snel mogelijk, zet de CSS aan de bovenkant van de pagina in het document HEAD. Dit maakt pagina's lijken sneller te laden, omdat dit vergemakkelijkt progressieve weergave van de pagina. Dit is vooral belangrijk voor pagina's met veel inhoud en voor gebruikers op tragere internetverbindingen.

Het is een gedocumenteerd feit dat de algehele gebruikerservaring te verbeteren, is het belangrijk om de voortgang indicatoren en visuele feedback. Om te voorkomen dat elementen van de pagina opnieuw te tekenen, in het geval als hun stijl te veranderen, sommige browsers, waaronder IE, blokken van de pagina totdat de CSS volledig geladen is. Vanwege dit, is de gebruiker te zien krijgt een lege witte pagina.

De W3 HTML-specificaties ', stelt ook dat de CSS moet me nemen in de HEAD sectie van de HTML-pagina. at the bottom of the page, so it's best not to use it. Ook rekening mee dat, in IE @import op dezelfde manier gedraagt ​​als het gebruik van <link> aan de onderkant van de pagina, dus het is best niet te gebruiken.

Vermijd het gebruik van browser-specifieke functies

Filters: Het gebruik van filters verhoogt het geheugen verbruik en wordt toegepast per element, niet per beeld, dus het probleem is vermenigvuldigd. Ook Filters zijn IE Proprietary, zal dus niet zoals de bedoeling is te werken in andere browsers. Als u wilt dat transparant of gradient achtergrond, gebruik 1Pixel met beelden.
Expressions: CSS expressies zijn een leuke feature te hebben in CSS, maar is nog steeds IE specifieke functie. Ook is het belangrijk op te merken dat, deze uitdrukkingen zijn geëvalueerd wanneer de pagina wordt weergegeven en aangepast, gescrold en zelfs wanneer de gebruiker met de muis over de pagina. Onnodig te zeggen dat dit kan invloed hebben op de prestaties van uw pagina. Vandaar dat in eenvoudige woorden, Vermijd het gebruik van CSS expressies, tenzij u denkt dat de profs 'weegt meer dan de nadelen'

Te externaliseren je CSS

Gebruik van externe CSS resulteren in een snellere laden van pagina's, omdat de JavaScript-en CSS-bestanden worden in de cache van de browser. Inline CSS in HTML-documenten te downloaden elke keer als het HTML-document wordt aangevraagd. Dit zou in feite het aantal gemaakte HTTP-verzoeken, maar nadien neemt de grootte van het HTML-document. Externe CSS worden gecached door de browser, de grootte van het HTML-document wordt verminderd, zonder toename van het aantal HTTP-verzoeken.

Houdt u er rekening mee dat, als gebruikers op uw site meerdere bekeken pagina's per sessie en veel van uw pagina's hergebruik van dezelfde scripts en stylesheets, is er een groter potentieel voordeel van externe bestanden in de cache.

Pak je CSS bestand

Verpakking of kraken je CSS is de praktijk van het verwijderen van overbodige personages uit code om het te verkleinen en verbeterd daarmee laadtijden.

De CSS kan vermalen me door het verwijderen van alle opmerkingen en eventuele ongewenste karakters zoals spaties, nieuwe regels etc.

Voor leeftijden, heb ik denken aan al de Best Practices te consolideren, heb ik het lezen zo nu en dan. Eindelijk! Ik heb get down om het te maken aan pen. Ik realiseerde me dat het gaat om enorme taak het creëren van deze mammoet document, dus heb ik besloten om een ​​hele categorie wijden aan, dus ik kon blijven toevoegen dingen over best practices als en wanneer ik ze tegenkomen ...

Goed! de inhoud zal hier een samensmelting van mijn persoonlijke ontwikkeling UI Best Practices met die geschreven door de standaard-ontwikkelaars zoals Yahoo, Google, etc. worden

Bekijk deze ruimte en houdt browing de categorie Best Practices

Eenvoudige sprekende (voor degenen die nog nooit van gehoord doctype voor vandaag)! DOCTYPE is de verklaring in een HTML-document dat komt vóór de <HTML> tag, dat zoiets als dit (geplakt uit de bron van deze zeer pagina) ziet er

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

Daarom is oplossing voor dit probleem was om

• stellen web developers die wisten hun normen om te kiezen welke modus te gebruiken.
• blijven het weergeven van oude pagina's volgens de oude (eigenaardigheden) regels.

En DOCTYPE was geboren.

Ja, op basis van of je pagina is ontworpen om normen of niet, je kiest de juiste doctype.

Oude pagina's geschreven voor deze normen werden geïntroduceerd hebben geen doctype. Daarom, als er geen DOCTYPE in je HTML dan de browser in quirks mode.
Maar als de DOCTYPE wordt gedefinieerd als een van de volgende, dan is de browser wordt gezegd dat in de strikte modus.

<DOCTYPE html PUBLIC "- / / W3C / / DTD HTML 4.01 Transitional / / EN" "http://www.w3.org/TR/html4/loose.dtd">