Thomas123: Schnelleres Rendering dank HTMLCode

ich benutze Opera und Firefox parallel. Das Rendering beim Opera ist um ein vielfaches schneller als beim Firefox. Richtige Webprogramme machen einfach nur mit dem Opera spaß. (mir zumindest)

Jetzt aber mal zu meiner eigentlichen frage:
Wie kann ich das Rendering beschleunigen. Also im sinne der HTML-Gestaltung. Welche Tags, welche Tag-Kombinationen sind echte Zeitfresser?

  • CSS schneller als ohne CSS?
  • XHTML 1.1? HTML 4.1?
  • Alles auslagern oder nicht? (JavaScript,CSS,...)
  • Tabellen mit <table> oder <div>?
  • Kann ich Images/Icons die auf einer Seite öffters vorkommen beschleunigen? Klar sie werden nur einmal geladen, aber eben beim Rendern öffters angezeigt.....
  • ...
  • ...

Wie kann ich das Rendering auf kompfortable weise testen?
sowas in der art: (halt nur auf rendering bezogen...) http://www.websiteoptimization.com/services/analyze/

PS: Über das Thema habe ich noch niemanden berichten gehört/gesehen.

  1. Hallo Freunde des gehobenen Forumsgenusses,

    ich benutze Opera und Firefox parallel. Das Rendering beim Opera ist um ein vielfaches schneller als beim Firefox. Richtige Webprogramme machen einfach nur mit dem Opera spaß. (mir zumindest)

    Ich kann das nicht nachvollziehen, welche Versionen von Opera und Firefox mit welchen Plugins / Extensions nutzt du unter welchem Betriebssystem mit welcher Hardware?

    Hast du das gemessen oder ist das subjektiv?

    Jetzt aber mal zu meiner eigentlichen frage:
    Wie kann ich das Rendering beschleunigen. Also im sinne der HTML-Gestaltung. Welche Tags, welche Tag-Kombinationen sind echte Zeitfresser?

    Wenig Code wird schneller verarbeitet als viel Code :-)

    • CSS schneller als ohne CSS?

    Ohne CSS braucht man massenhaft Tabellen, die nur Traffic verschwenden.

    • XHTML 1.1? HTML 4.1?

    IMHO Geschmackssache, wenn du gut mit XHTML zurecht kommst nimm XHTML, wenn du lieber HTML schreibtst auch gut, ich glaube kaum, dass das bei der Geschwindigkeit eine Rolle spielt.

    • Alles auslagern oder nicht? (JavaScript,CSS,...)

    Alles was ausgelagert wird muss vom Browser nur einmal abgerufen werden, danach liegt es im Cache. Der erste Aufruf ist also etwas langsamer durch den HTTP-Overhead, alle weiteren viel schneller.

    • Tabellen mit <table> oder <div>?

    Tabellen werden wie immer mit <table></table> ausgezeichnet.

    PS: Über das Thema habe ich noch niemanden berichten gehört/gesehen.

    Wenn mich nicht alles täuscht war in irgendeiner der Zeitschriften, die ich in den letzten drei Wochen gelesen habe so ein Test, ich schau heute Abend mal, ob ich die wieder finde.

    Gruß
    Alexander Brock

    1. Hallo Alexander.

      • CSS schneller als ohne CSS?

      Ohne CSS braucht man massenhaft Tabellen, die nur Traffic verschwenden.

      Warum sollte man? Man kann auch wunderbar gänzlich strukturell auszeichnen und dabei aufs Stylesheet verzichten. Warum sollte man da auf Tabellen ausweichen?

      • XHTML 1.1? HTML 4.1?

      IMHO Geschmackssache, wenn du gut mit XHTML zurecht kommst nimm XHTML, wenn du lieber HTML schreibtst auch gut, ich glaube kaum, dass das bei der Geschwindigkeit eine Rolle spielt.

      Einmal abgesehen davon, dass es HTML 4.1 nicht gibt (meintest du 4.01?) könnte das Rendering unter Umständen durchaus schneller sein, wenn der Client nur auf absolut sauber geschriebenen Code trifft. (Also insbesondere in Bezug auf die Wohlgeformtheit.)
      Getestet habe ich dies jedoch noch nicht; ich wüsste auch nicht wie.

      • Tabellen mit <table> oder <div>?

      Tabellen werden wie immer mit <table></table> ausgezeichnet.

      Und bedürfen normalerweise einer längeren Ladezeit.

      Einen schönen Montag noch.

      Gruß, Ashura

      --
      sh:( fo:} ch:? rl:( br: n4:~ ie:{ mo:| va:) de:> zu:} fl:( ss:) ls:[ js:|
      mathbr:del.icio.us/ mathbr:w00t/
      1. Hallo Freunde des gehobenen Forumsgenusses,

        Warum sollte man? Man kann auch wunderbar gänzlich strukturell auszeichnen und dabei aufs Stylesheet verzichten. Warum sollte man da auf Tabellen ausweichen?

        Ich bin davon ausgegangen, dass die Optik Thomas nicht egal ist.

        • Tabellen mit <table> oder <div>?

        Tabellen werden wie immer mit <table></table> ausgezeichnet.

        Und bedürfen normalerweise einer längeren Ladezeit.

        Als was?

        Gruß
        Alexander Brock

        1. Hallo Alexander.

          Tabellen werden wie immer mit <table></table> ausgezeichnet.

          Und bedürfen normalerweise einer längeren Ladezeit.

          Als was?

          Als alle anderen Elementkonstrukte.

          Einen schönen Montag noch.

          Gruß, Ashura

          --
          sh:( fo:} ch:? rl:( br: n4:~ ie:{ mo:| va:) de:> zu:} fl:( ss:) ls:[ js:|
          mathbr:del.icio.us/ mathbr:w00t/
          1. also danke erstmal für die antworten.

            1. das der opera schneller rendert ist eine tatsache. kannst mal eine riesige htmldatei erstellen, also ich mein wirklich riesig. dann das ganze mal mit den verscheidenen browsers laden. der opera ist enorm schneller.

            2. ja ich meinte 4.01.

            jetzt mal bisschen hintergrund.
            ich bin dabei ein online bookmarksystem zu erstellen. mit diesem tool soll gearbeitet werden sich nicht wie auf anderen seiten informationen durchgelesen werden. deswegen soll dies alles so schnell wie möglich sein.

            mein aktueller stand:
            im moment bin ich dabei (eigentlich fertig) das html template zu erstellen. dabei achte ich sehr kleinlich auch die syntax. ich verwende XHTML1.1 und kontrulliere ständig mit dem w3 validator. das layout ist ohne tabellen erstellt. im html stehen keinerlei formatierungen. nachezu keine attribute (ausnahmen: id, class, src, alt).
            gerade in diesem stadium will ich das renering "perfektionieren".

            PS: ich habe mir auch schon überlegt, das ganze mit ajax zu machen. aber 1. muss ich mich dann erstmal viel einarbeiten und 2. ist das wieder browserinkompatibel.

            1. Hallo Thomas123.

              PS: ich habe mir auch schon überlegt, das ganze mit ajax zu machen. aber 1. muss ich mich dann erstmal viel einarbeiten und 2. ist das wieder browserinkompatibel.

              XHTML 1.1 auch. Warum verwendest du nicht XHTML 1.0?

              Einen schönen Montag noch.

              Gruß, Ashura

              --
              sh:( fo:} ch:? rl:( br: n4:~ ie:{ mo:| va:) de:> zu:} fl:( ss:) ls:[ js:|
              mathbr:del.icio.us/ mathbr:w00t/
              1. ich weiß jetzt nicht genau wo der unterschied zwischen xhtml 1.0 und xhtml 1.1 ist. ausser, dass bei der 1.1 noch mathematische funktionen dargestellt werden können.

                ich verwende bei xhtml 1.1 allerdings keine anderen tags als bei xhtml 1.0. ich hab mich dafür entschieden, weil es halt die neuste version ist. sonst gibt es keinen grund dafür.

                was spricht für und gegen 1.1?

                1. Hallo Thomas123.

                  ich weiß jetzt nicht genau wo der unterschied zwischen xhtml 1.0 und xhtml 1.1 ist. ausser, dass bei der 1.1 noch mathematische funktionen dargestellt werden können.

                  Das ist bei XHTML 1.0, ja sogar in HTML möglich.

                  ich verwende bei xhtml 1.1 allerdings keine anderen tags als bei xhtml 1.0. ich hab mich dafür entschieden, weil es halt die neuste version ist. sonst gibt es keinen grund dafür.

                  Dann solltest du deine Beweggründe wirklich einmal überdenken.

                  was spricht für und gegen 1.1?

                  Pro
                    • du kannst Ruby-Annotiationen direkt im Dokument notieren

                  Kontra
                    • du musst auf das lang-Attribut verzichten
                    • du musst auf das name-Attribut in a- und map-Elementen verzichten
                    • du musst XHTML 1.1-Dokumente als application/xhtml+xml ausliefern
                    • du musst strikt konforme Dokumente erstellen (XHTML 1.1 ≈ XHTML 1.0 Strict)
                    • du darfst den Dokumentenbaum nur per DOM-Methoden manipulieren (resultierend aus der Auslieferung als XML)

                  Einen schönen Montag noch.

                  Gruß, Ashura

                  --
                  sh:( fo:} ch:? rl:( br: n4:~ ie:{ mo:| va:) de:> zu:} fl:( ss:) ls:[ js:|
                  mathbr:del.icio.us/ mathbr:w00t/
                  1. also da sind doch einige kontras dabei, aber:

                    das lang attribut hab ich noch nie und werde ich auch nicht verwenden. ebenso das name attribut (es sei den bei <input>).
                    Ich erstelle nur strikt konforme dokumente.
                    das mit den DOM Methoden ist sowieso besser.

                    jetzt aber zu "application/xhtml+xml": also ich sende das dokument nicht als xml. der w3 validator hat da aber nichts angemekkert.... jetzt frag ich mich warum? wieso? weshalb?

                    jetzt ist mir gerade nochetwas aufgefallen. in xhtml1.0 strict und 1.1 gibt es kein target attribut. wie kann ich den dan einen link im neuen fenter öffnen?

                    1. Hallo Thomas,

                      jetzt ist mir gerade nochetwas aufgefallen. in xhtml1.0 strict und 1.1 gibt es kein target attribut. wie kann ich den dan einen link im neuen fenter öffnen?

                      garnicht. Überlass es dem User wo er sein Fenster öffnet.

                      Grüße aus Nürnberg
                      Tobias

                      1. was ist mit externen links?

                        1. Hallo Thomas,

                          was ist mit externen links?

                          genauso - der User kann auch die in einem neuen Fenster/Tab öffnen, wenn er das wünscht.

                          Grüße aus Nürnberg
                          Tobias