Matthias Apsel: JavaScript im head oder body einbinden?

Hallo Gunnar Bittersmann,

Scripte sollten, wenn sie nicht async oder defer sind, möglichst am Ende des body eingebunden werden, um das Rendern der Seite nicht zu blockieren.

Lassen sich Empfehlungen geben unter welchen Umständen was vorzuziehen wäre?

Bis demnächst
Matthias

--
Dieses Forum nutzt Markdown. Im Wiki erhalten Sie Hilfe bei der Formatierung Ihrer Beiträge.
  1. @@Matthias Apsel

    Scripte sollten, wenn sie nicht async oder defer sind, möglichst am Ende des body eingebunden werden, um das Rendern der Seite nicht zu blockieren.

    Lassen sich Empfehlungen geben unter welchen Umständen was vorzuziehen wäre?

    Ich würd da nach „async defer jake archibald“ suchen. Treffer.

    LLAP 🖖

    --
    “When UX doesn’t consider all users, shouldn’t it be known as ‘Some User Experience’ or... SUX? #a11y” —Billy Gregory
  2. Lassen sich Empfehlungen geben unter welchen Umständen was vorzuziehen wäre?

    Mehr und mehr gehe ich dazu über, CSS und Javascript nach Bedarf zu laden.

    Beispiel: Für die Erfassung eines Veranstaltungstermins können nacheinander mehrere Formulare aufgerufen werden. Zunächst die Basisdaten, dann Zusätze.

    Aber nur bei den Basisdaten benötige ich Ajax, um Ergänzungs-Vorschläge für die ersten getippten Buchstaben eines Ortes zu holen. Warum sollte ich diese Javascript-Datei für alle anderen Formulare auch laden?

    Und ich muss nicht immer durch die Basisdaten durch, und damit nicht die JS Datei in den Cache laden. Bei Änderungen kann ich direkt die Zusätze ändern.

    CSS- und JS-Angaben sind dann Teil des Objekts, im Sinne von objektorientierter Programmierung. Warum sollte ich die Angaben zu einem Formular in den Kopf- oder Fussbereich der Seite packen und damit zerteilen? Schlecht für die Übersicht, gut für Fehler.

    Linuchs

    1. Hallo

      CSS- und JS-Angaben sind dann Teil des Objekts, im Sinne von objektorientierter Programmierung. Warum sollte ich die Angaben zu einem Formular in den Kopf- oder Fussbereich der Seite packen und damit zerteilen? Schlecht für die Übersicht, gut für Fehler.

      also CSS im Body?

      Gruß
      Jürgen

      1. Hallo JürgenB,

        also CSS im Body?

        Bis demnächst
        Matthias

        --
        Dieses Forum nutzt Markdown. Im Wiki erhalten Sie Hilfe bei der Formatierung Ihrer Beiträge.
        1. Hallo Matthias,

          deswegen die Nachfrage, die Unterstützung ist extrem mau.

          Gruß
          Jürgen

          1. Der neue "Quelltext" sieht ja seltsam aus …

            Hallo Jürgen,

            deswegen die Nachfrage, die Unterstützung ist extrem mau.

            Ich packe "Objekte", also zusammengehörendes CSS, HTML und Javascript in einen Container mit ID. Die zusätzlichen styles beschränken sich auf diese ID:

            <div id="basis">
            <style scoped>
            #basis {
              border: 1px solid #aaa;
            }
            #basis h1 {
              color: #f00;
            }
            </style>
            <script>...<script>
            <h1>Basisangaben</h1>
            ...
            </div><!-- id="basis" -->
            

            Linuchs

            1. Hallo Linuchs,

              Der neue "Quelltext" sieht ja seltsam aus …

              Nicht, wenn man es richtig macht.

              3 Tilden für Block-Code, Backticks für inline-Code. Wie immer eigentlich.

              Bis demnächst
              Matthias

              --
              Dieses Forum nutzt Markdown. Im Wiki erhalten Sie Hilfe bei der Formatierung Ihrer Beiträge.
              1. 3 Tilden für Block-Code, Backticks für inline-Code. Wie immer eigentlich.

                Nur, dass bei mir (FF 48.0) bei Klick auf [Quelltext] die Backticks kommen und nicht die Tilden wie bisher.

                1. Hallo Linuchs,

                  3 Tilden für Block-Code, Backticks für inline-Code. Wie immer eigentlich.

                  Nur, dass bei mir (FF 48.0) bei Klick auf [Quelltext] die Backticks kommen und nicht die Tilden wie bisher.

                  Ich habe es gerade mal ausprobiert (ich gebe die Tilden immer von Hand ein, das ist m. M. n. auch der Vorteil von Markdown):

                  • wenn du nichts markiert hast, bekommst die Backticks
                  • wenn du eine Zeile markiert hast, bekommst du ebenfalls die Backticks drumherum gepackt
                  • wenn du mehrere Zeilen ausgewählt hast, macht er dir die Tilden drumherum

                  Nebenbei: Du solltest mal deinen Browser updaten.

                  Gruß
                  Julius

                  1. Hallo Julius,

                    Nur, dass bei mir (FF 48.0) bei Klick auf [Quelltext] die Backticks kommen und nicht die Tilden wie bisher.

                    Früher wurden beim Klick auf den Button in vielen Fällen Tilden eingefügt, auch wenn es sich eigentlich um inline-Code gehandelt hat. Der so erzeugte Codeblock wurde dann wegen fehlender Newlines vor der Markierung nicht gerendert. Das war ein Bug den ich kürzlich gefixt habe.

                    Ich habe es gerade mal ausprobiert (ich gebe die Tilden immer von Hand ein, das ist m. M. n. auch der Vorteil von Markdown):

                    • wenn du nichts markiert hast, bekommst die Backticks
                    • wenn du eine Zeile markiert hast, bekommst du ebenfalls die Backticks drumherum gepackt
                    • wenn du mehrere Zeilen ausgewählt hast, macht er dir die Tilden drumherum

                    So sollte es sein. Ich bin allerdings am überlegen, ob ich für den Fall das nichts markiert wurde und dann der Button gedrückt wird, einen Test einbauen soll. Wenn der Cursor am Anfang der Zeile ist und davor eine Leerzeile ist, könnte man statt Backticks Tilden für einen Codeblock einfügen.

                    Beste Grüße,

                    Orlok

                    1. Hallo Orlok,

                      Wenn der Cursor am Anfang der Zeile ist und davor eine Leerzeile ist, könnte man statt Backticks Tilden für einen Codeblock einfügen.

                      sollte. Oder wie kann ich einen Codeblock auszeichnen, wenn da (noch) nichts zu markieren ist?

                      Gruß
                      Jürgen

                    2. Hallo Orlok,

                      • wenn du nichts markiert hast, bekommst die Backticks
                      • wenn du eine Zeile markiert hast, bekommst du ebenfalls die Backticks drumherum gepackt
                      • wenn du mehrere Zeilen ausgewählt hast, macht er dir die Tilden drumherum

                      So sollte es sein.

                      Das dachte ich mir, finde ich gut :-)

                      Ich bin allerdings am überlegen, ob ich für den Fall das nichts markiert wurde und dann der Button gedrückt wird, einen Test einbauen soll.

                      Einen Hinweis- oder Beispieltext?

                      Wenn der Cursor am Anfang der Zeile ist und davor eine Leerzeile ist, könnte man statt Backticks Tilden für einen Codeblock einfügen.

                      Das klingt gut. Aber dieses Verhalten müsste man den Nutzern noch irgendwie (Tooltip?) erklären, es ist zwar praktisch, aber nicht für jedermann intuitiv.

                      Gruß
                      Julius

                      1. Hallo,

                        Ich bin allerdings am überlegen, ob ich für den Fall das nichts markiert wurde und dann der Button gedrückt wird, einen Test einbauen soll.

                        Einen Hinweis- oder Beispieltext?

                        Z.B.: „Bitte genauer lesen!“

                        Gruß
                        Kalk

                        1. Hallo Tabellenkalk,

                          Ich bin allerdings am überlegen, ob ich für den Fall das nichts markiert wurde und dann der Button gedrückt wird, einen Test einbauen soll.

                          Einen Hinweis- oder Beispieltext?

                          Z.B.: „Bitte genauer lesen!“

                          Ja, genau diesen Hinweis hätte ich gerne immer vor dem Schreiben jedes einzelnen Buchstaben :-)

                          Gruß
                          Julius

                      2. Servus!

                        @all @Matthias Apsel

                        Ist Euch eigentlich schon mal aufgefallen, dass sich spätestens nach dem 5. Posting jeder Thread um Änderungen an der Forums-UI oder den Markdown-Regeln dreht?

                        Ist das so gewollt, um das Forum am Leben zu erhalten oder wollt ihr uns einch nur so verwirren?

                        Herzliche Grüße

                        Matthias Scharwies

                        --
                        Es gibt viel zu tun: ToDo-Liste
                        1. Hallo Matthias,

                          … oder wollt ihr uns einch nur so verwirren?

                          also ich nicht. Mir war nur nach dem Posting von Orlok aufgefallen, dass der Quelltextbutton als Default einen Einzeiler vorsieht. Mir gefiel Mehrzeiler (mit ~~~) als Default besser. Die Idee von Orlok, die Entscheidung kontextabhängig zu machen, finde ich auch gut.

                          Übrigens, könnte man solche Drifts nicht einfach in einen neuen Thread schieben?

                          Gruß
                          Jürgen

            2. Hallo Linuchs,

              und wie reagieren die Browser, die scope nicht unterstützen?

              Gruß
              Jürgen

              1. Hallo JürgenB,

                und wie reagieren die Browser, die scope nicht unterstützen?

                Die meisten wenden das CSS auf das gesamte Dokument an und überschreiben ggf. vorherige Deklarationen.

                Bis demnächst
                Matthias

                --
                Dieses Forum nutzt Markdown. Im Wiki erhalten Sie Hilfe bei der Formatierung Ihrer Beiträge.
                1. Hallo Matthias,

                  gibt es auch Browser, die das CSS im Body ignorieren?

                  Gruß
                  Jürgen

                  1. Hallo JürgenB,

                    gibt es auch Browser, die das CSS im Body ignorieren?

                    keine Ahnung. Insgesamt ist aber davon abzuraten, sich auf undokumentiertes Verhalten zu verlassen.

                    Bis demnächst
                    Matthias

                    --
                    Dieses Forum nutzt Markdown. Im Wiki erhalten Sie Hilfe bei der Formatierung Ihrer Beiträge.
              2. Hallo Jürgen,

                und wie reagieren die Browser, die scope nicht unterstützen?

                Die wenden die style-Angaben auf den Container mit id="basis" an. Davon sollte es nur einen geben im Dokument.

                Linuchs