Meine Webanwendung zielt auf große Smartphones ab, und ich muss die CSS-Datei je nach Gerät ändern (wenn Probleme in der Benutzeroberfläche auftreten müssen), und ich plane Swap-CSS mit folgendem jQuery. Ich will nur wissen, ob es eine Best Practice und eine gute Performance ist.
%Vor%1.Ist es beste Praxis?
Hängt davon ab, was Sie als Best Practice betrachten, und welche Best Practice im Zusammenhang mit Ihrer Bewerbung und Ihrem Unternehmen steht. Eine Sache, über die ich nachdenken kann, ist: Können Sie garantieren, dass alle Seiten jQuery verwenden? Wenn das der Fall ist, denke ich, dass dies ein guter Ansatz ist, um das zu erreichen, wonach Sie suchen. Eine Alternative wäre, diese Server-Seite zu machen, die die beste Leistung garantieren würde, aber es könnte andere Gründe geben, warum Sie das nicht tun wollen (vielleicht haben Sie keinen Zugang zu serverseitigem Code, oder Sie möchten die meisten davon pflegen) Funktionalität in den Händen von Front-End-Programmierern).
2.Ist es gut in der Leistung?
Die kurze Antwort ist nein. Zusätzlich benötigt man die 100K + Nutzlast von jQuery, um das CSS auf die Seite zu injizieren. Die Art und Weise, wie Sie das Problem im Moment angegangen sind, besteht darin, auf die gesamte Seite (und alle Abhängigkeiten) zu warten, bevor Sie Stile hinzufügen. Dies wird einen bemerkenswerten "Sprung" zwischen dem ersten Aufruf der Seite (ohne Stile) und dem Laden der Stile und der Bewegung aller Objekte erzeugen.
Das Laden der CSS-Server-Seite wird das Problem lösen, aber ich denke, Sie können dies immer noch in der Benutzeroberfläche tun und den Großteil Ihrer Code-Basis in JavaScript behalten, was die Pflege erleichtert. Entfernen Sie dazu das Bit, auf das Sie warten, bis das Dokument geladen ist, bevor Sie Ihre CSS-Datei aufrufen:
%Vor%Um die Leistung weiter zu verbessern, können Sie eine Lösung verwenden, die nicht von jQuery abhängt, sondern von
%Vor% Sie könnten #cssLink zum Stylesheet <link> -Element hinzufügen und das DOM verwenden, um dasselbe zu tun:
Dies würde Ihren Code wie folgt aussehen lassen:
%Vor%Auf diese Weise werden Sie die Abhängigkeit von der 100K-Nutzlast von jQuery entfernen, bevor Sie Ihre Stylesheets auf die Seite anwenden können.
UPDATE:
Es ist auch möglich, CSS-Regeln basierend auf der Bildschirmgröße anstelle des Geräts anzuwenden.
Habt ihr mal @ Media-Abfragen ?
Tags und Links javascript html jquery css smartphone