Eine kurze Zusammenfassung der grundlegenden Regeln zur Leistungsoptimierung von Webseiten

Eine kurze Zusammenfassung der grundlegenden Regeln zur Leistungsoptimierung von Webseiten

Einige Optimierungsregeln für Browser-Webseiten

Seitenoptimierung

Statische Ressourcenkomprimierung

Verwenden Sie Build-Tools (Webpack, Gulp), um statische Ressourcen von Webseiten wie Bilder, Skripts und Stile entsprechend zu komprimieren.

CSS-Sprites, Base64-Inline-Bilder

Kombinieren Sie die kleinen Symbole auf der Site zu einem Bild, verwenden Sie CSS, um die entsprechenden Symbole zu finden und zu erfassen; verwenden Sie Inline-Bilder entsprechend.

Stile werden oben und Skripte unten platziert

Die Seite wird schrittweise präsentiert. Wenn Sie den Stil oben platzieren, kann die Seite dem Benutzer schneller präsentiert werden. Wenn Sie das <script>-Tag oben platzieren, wird der Download von Ressourcen hinter der Seite blockiert.

Verwenden Sie externes CSS und JS

Mehrere Seiten verweisen auf gemeinsame statische Ressourcen und die Wiederverwendung von Ressourcen reduziert zusätzliche HTTP-Anfragen.

Vermeiden Sie Bilder mit leerem Quellcode

Vermeiden Sie unnötige HTTP-Anfragen.

<!-- Bilder mit leerem Quellcode initiieren weiterhin HTTP-Anfragen-->
<img src="" alt="Bild" />

Vermeiden Sie die Skalierung von Bildern in HTML

Versuchen Sie die angegebene Größe des Bildes nach Bedarf zu nutzen, anstatt ein großes Bild zu laden und es anschließend zu verkleinern.

<!-- Die tatsächliche Bildgröße beträgt 600 x 300, skaliert auf 200 x 100 in HTML -->
<img src="/static/images/a.png" width="200" height="100" alt="bild" />

Vorladen

Durch Festlegen des Preload-Attributs für die rel-Eigenschaft des Link-Tags kann der Browser Ressourcen vorladen, bevor der Haupt-Rendering-Mechanismus eingreift. Dieser Mechanismus kann Ressourcen früher abrufen und blockiert die Initialisierung der Seite nicht.

<!DOCTYPE html>
<html lang="de">
<Kopf>
  <meta charset="UTF-8">
  <title>Dokument</title>
  <link ref="vorladen" href="style.css" as="style">
  <link ref="vorladen" href="main.js" as="script">
  
  <link ref="stylesheet" href="style.css">
</Kopf>
<Text>
  
  <script src="main.js"></script>
</body>
</html>

Im Beispiel werden CSS- und JS-Dateien vorab geladen und sofort aufgerufen, sobald sie beim nachfolgenden Rendern der Seite verwendet werden.

Sie können den Typ angeben, um verschiedene Arten von Ressourcen zu laden.

  1. Stil
  2. Skript
  3. Video
  4. Audio-
  5. Bild
  6. Schriftart
  7. dokumentieren
  8. ...

Mit dieser Methode können durch Festlegen des Attributs „Crossorigin“ auch Ressourcen über mehrere Domänen hinweg vorgeladen werden.

<link rel="preload" href="fonts/cicle_fina-webfont.woff2" as="Schriftart" type="font/woff2" crossorigin="anonym">

CSS

Wähler

Die Selektoren haben die folgende Prioritätsreihenfolge (von der höchsten zur niedrigsten):

  1. ID-Selektor
  2. Klassenselektoren
  3. Tag-Selektor
  4. Angrenzender Selektor
h1 + p{ oberer Rand: 15px; }

Wählt den Absatz aus, der unmittelbar nach einem h1-Element erscheint. Die h1- und p-Elemente haben ein gemeinsames übergeordnetes Element.

Untergeordnete Selektoren

h1 > stark {Farbe:rot;}

Nachkommenselektoren

h1 em {Farbe: rot;}

Platzhalterselektor

Attributselektoren

*[Titel] {Farbe:rot;}
img[alt] {border: 5px durchgezogenes Rot;}

Pseudoklassen-Selektoren

Erfahrung bei der Verwendung des Selektors:

  1. Geben Sie Klassenselektoren den Vorzug, die mehrschichtige Tag-Selektoren ersetzen können.
  2. Verwenden Sie ID-Selektoren mit Vorsicht. Sie sind zwar effizient, aber auf der Seite eindeutig, was der Zusammenarbeit und Wartung im Team nicht förderlich ist.
  3. Machen Sie sinnvollen Gebrauch von der Vererbung von Selektoren;
  4. Vermeiden Sie CSS-Ausdrücke.

Reduzieren Sie die Anzahl der Selektoren

Basierend auf der Priorität des vorherigen Selektors sollten Sie versuchen, die Verschachtelung mehrerer Selektorebenen zu vermeiden, vorzugsweise nicht mehr als 3 Ebenen.

.container .text .logo{ Farbe: rot; }

/*Ändern in*/
.container .text-logo{ Farbe: rot; }

Optimieren Sie Seitenstildateien und entfernen Sie nicht verwendete Stile

Der Browser führt unnötige Stilanpassungen durch, was sich auf die Renderzeit auswirkt. Darüber hinaus wirken sich übermäßig große Stildateien auch auf die Ladegeschwindigkeit aus.

Verwenden der CSS-Vererbung zur Reduzierung der Codemenge

Durch die Verwendung der vererbbaren Eigenschaften von CSS legt das übergeordnete Element den Stil fest und das untergeordnete Element muss ihn nicht erneut festlegen.

Zu den häufig vererbten Eigenschaften zählen: Farbe, Schriftgröße, Schriftfamilie usw.; zu den nicht vererbten Eigenschaften zählen: Position, Anzeige, Float usw.

Wenn der Attributwert 0 ist, wird keine Einheit hinzugefügt

Wenn der CSS-Attributwert 0 ist, ist keine Einheit erforderlich, um die Codemenge zu reduzieren.

.text{ Breite: 0px; Höhe: 0px; }

/*Ändern in*/
.text{ Breite: 0; Höhe: 0; }

JavaScript

Verwenden der Ereignisdelegierung

Verwenden Sie die Ereignisdelegation, um Ereignisse an mehrere ähnliche DOM-Elemente zu binden.

<ul id="Behälter">
  <li Klasse="Liste">1</li>
  <li Klasse="Liste">2</li>
  <li Klasse="Liste">3</li>
</ul>
// Unsinniger Weg: Binden Sie das Klickereignis an jedes Element $('#container .list').on('click', function() {
  var text = $(dieser).text();
  konsole.log(text);
});

// Methode zur Ereignisdelegierung: Verwenden Sie den Ereignis-Bubbling-Mechanismus, um Ereignisse an das übergeordnete Element zu delegieren$('#container').on('click', '.list', function() {
  var text = $(dieser).text();
  konsole.log(text);    
});

Es ist zu beachten, dass Ereignisse bei Verwendung der Ereignisdelegierung zwar an Dokumente delegiert werden können, dies jedoch unvernünftig ist. Zum einen kann es leicht zu Fehleinschätzungen von Ereignissen kommen und zum anderen ist die Sucheffizienz in der Bereichskette gering. Als Delegatobjekt sollte das nächstgelegene übergeordnete Element ausgewählt werden.

Neben der besseren Leistung entfällt durch die Ereignisdelegation auch die Notwendigkeit, Ereignisse an dynamisch erstellte DOM-Elemente zu binden.

DOMContentLoaded

Sie können mit der Verarbeitung des DOM-Baums beginnen, nachdem die DOM-Elemente geladen wurden (DOMContentLoaded), ohne warten zu müssen, bis alle Bildressourcen heruntergeladen sind.

// Natives JavaScript
document.addEventListener("DOMContentLoaded", Funktion(Ereignis) {
  console.log("DOM vollständig geladen und analysiert");
}, FALSCH);

// jQuery
$(Dokument).bereit(Funktion() {
  console.log("bereit!");
});

// Eine vereinfachte Version von $(document).ready()$(function() {
  console.log("bereit!");
});

Vorladen und verzögertes Laden

Vorladen

Nutzen Sie die Leerlaufzeit des Browsers, um Ressourcen vorzuladen, die möglicherweise später verwendet werden, beispielsweise Bilder, Stile und Skripts.

Bedingungsloses Vorladen

Sobald Onload ausgelöst wird, erhalten Sie sofort die Ressourcen, die in Zukunft benötigt werden.

Bildressourcen vorab laden. (3 Möglichkeiten zum Implementieren des Vorladens von Bildern).

Vorladen basierend auf dem Benutzerverhalten

Bestimmen Sie die möglichen Vorgänge des Benutzerverhaltens und laden Sie Ressourcen vorab, die in Zukunft möglicherweise benötigt werden.

  1. Wenn der Benutzer etwas in das Suchfeld eingibt, werden die Ressourcen vorab geladen, die auf der Suchergebnisseite verwendet werden können.
  2. Bedient ein Nutzer einen Tab, wird standardmäßig einer davon angezeigt. Klickt der Nutzer auf weitere Optionen, können beim Darüberfahren mit der Maus die zukünftig zu verwendenden Ressourcen geladen werden.

Lazy Loading

Mit Ausnahme der Inhalte oder Komponenten, die für die Seiteninitialisierung erforderlich sind, können alle anderen Elemente verzögert geladen werden, z. B. JS-Bibliotheken zum Ausschneiden von Bildern, Bilder, die sich nicht im sichtbaren Bereich befinden usw.

Lazy Loading von Bildern. (Beurteilen Sie, ob sich das Bild im sichtbaren Bereich befindet. Wenn ja, weisen Sie dem Bild den tatsächlichen Pfad zu.)

Vermeidung globaler Lookups

Jede nicht lokale Variable, die mehr als einmal in einer Funktion verwendet wird, sollte zu einer lokalen Variable gemacht werden.

Funktion updateUI(){
  var imgs = document.getElementsByTagName("img");
  für (var i=0, len=imgs.length; i < len; i++){
    imgs[i].title = Dokument.Titel + " Bild " + i;
  }
  var msg = document.getElementById("msg");
  msg.innerHTML = "Aktualisierung abgeschlossen.";
}

Die globale Dokumentvariable wird in der obigen Funktion oft verwendet, insbesondere in der For-Schleife. Daher ist es eine bessere Lösung, die globale Dokumentvariable als lokale Variable zu speichern und dann zu verwenden.

Funktion updateUI(){
  var doc = Dokument;
  var imgs = doc.getElementsByTagName("img");
  für (var i=0, len=imgs.length; i < len; i++){
    imgs[i].title = doc.title + " Bild " + i;
  }
  var msg = doc.getElementById("msg");
  msg.innerHTML = "Aktualisierung abgeschlossen.";
}

Beachten Sie jedoch, dass im JavaScript-Code jede Variable, die nicht mit var deklariert ist, zu einer globalen Variable wird und eine unsachgemäße Verwendung zu Leistungsproblemen führt.

Vermeiden Sie unnötige Immobilienanfragen

Die Verwendung von Variablen und Arrays ist effizienter als der Zugriff auf Eigenschaften von Objekten, da das Objekt die Prototypenkette nach einer Eigenschaft mit diesem Namen durchsuchen muss.

// Verwenden des Arrays var values ​​= [5, 10];
var Summe = Werte[0] + Werte[1];
Alarm(Summe);

// Verwenden von Objekten var values ​​= { first: 5, second: 10};
var Summe = Werte.erste + Werte.zweite;
Alarm(Summe);

Im obigen Code werden Objekteigenschaften zur Berechnung verwendet. Das Nachschlagen einer oder zweier Eigenschaften verursacht keine Leistungsprobleme. Wenn jedoch mehrere Nachschlagevorgänge erforderlich sind, z. B. in einer Schleife, wird die Leistung beeinträchtigt.

Beim Nachschlagen mehrerer Eigenschaften zum Abrufen eines einzelnen Werts, beispielsweise:

var Abfrage = window.location.href.substring(window.location.href.indexOf("?"));

Sollte unnötige Eigenschaftensuchen reduzieren, indem window.location.href als Variable zwischengespeichert wird.

var url = fenster.standort.href;
var Abfrage = url.substring(url.indexOf("?"));

Funktionsdrosselung

Angenommen, es gibt ein Suchfeld. Binden Sie das Ereignis „onkeyup“ an das Suchfeld, sodass jedes Mal, wenn die Maus angehoben wird, eine Anforderung gesendet wird. Durch den Einsatz von Drosselungsfunktionen kann sichergestellt werden, dass mehrere aufeinanderfolgende Operationen innerhalb einer festgelegten Zeit bei der Benutzereingabe nur eine Anfrage auslösen.

<Eingabetyp="Text" ID="Eingabe" Wert="" />
// Ereignis binden document.getElementById('input').addEventListener('keyup', function() {
  Gas geben (Suche);
}, FALSCH);

//Logische Funktion function search() {
  console.log('suchen...');
}

//Drosselungsfunktion function throttle(Methode, Kontext) {
  Zeitüberschreitung löschen(Methode.tId);
  Methode.tId = setTimeout(Funktion() {
    Methode.Aufruf(Kontext);
  }, 300);
}

Die Anwendungsszenarien von Drosselungsfunktionen sind nicht auf Suchfelder beschränkt. Drosselungsfunktionen sollten beispielsweise verwendet werden, um die Leistung beim Scrollen von Seiten, Onscroll und beim Strecken des Fensters bei der Größenänderung zu verbessern.

Minimieren Sie die Anzahl der Anweisungen

Die Anzahl der Anweisungen wirkt sich auch auf die Geschwindigkeit der Operationsausführung aus.

Mehrere Variablendeklarationen zu einer zusammenführen

// Mehrere Var-Deklarationen verwenden var count = 5;
var Farbe = "blau";
var-Werte = [1,2,3];
var jetzt = neues Datum();

// Nach der Verbesserung var count = 5,
  Farbe = "blau",
  Werte = [1,2,3],
  jetzt = neues Datum();

Eine verbesserte Version wäre die Verwendung nur einer durch Kommas getrennten Var-Deklaration. Wenn viele Variablen vorhanden sind, ist die Verwendung nur einer Variablendeklaration viel schneller, als die Deklaration jeder Variablen einzeln.

Verwenden von Array- und Objektliteralen

Verwenden Sie Array- und Objektliterale anstelle einer Anweisung-für-Anweisung-Zuweisung.

var-Werte = neues Array();
Werte[0] = 123;
Werte[1] = 456;
Werte[2] = 789;

// Nach der Verbesserung var values ​​= [123, 456, 789];

var Person = neues Objekt();
person.name = "Jack";
Person.Alter = 28;
person.sayName = function(){
  Alarm (dieser Name);
};

// Verbesserte var person = {
  Name: "Jack",
  Alter: 28,
  sageName : Funktion(){
    Alarm (dieser Name);
  }
};

String-Optimierung

Zeichenfolgenverkettung

Frühere Browser optimierten die Methode zum Verketten von Zeichenfolgen mit Pluszeichen nicht. Da Zeichenfolgen unveränderlich sind, muss zum Speichern des Ergebnisses eine Zwischenzeichenfolge verwendet werden. Die häufige Erstellung und Zerstörung von Zeichenfolgen ist daher ineffizient.

var text = "Hallo";
text+= " ";
text+= "Welt!";

Durch das Hinzufügen der Zeichenfolge zum Array und das anschließende Aufrufen der Join-Methode des Arrays zum Konvertieren in eine Zeichenfolge wird die Verwendung des Additionsoperators vermieden.

var arr = [],
  ich = 0;
arr[i++] = "Hallo";
arr[i++] = " ";
arr[i++] = "Welt!";
var text = arr.join('');

Moderne Browser haben die Zeichenkettenverkettung mit dem Additionsoperator optimiert, daher ist der Additionsoperator in den meisten Fällen immer noch die bevorzugte Wahl.

Reduzieren Sie Reflows und Neulackierungen

Der Browser-Rendering-Prozess umfasst Reflow und Neuzeichnen, was ein leistungsintensiver Prozess ist. Sie sollten darauf achten, Aktionen zu reduzieren, die Reflow und Neuzeichnen während Skriptvorgängen auslösen.

  1. Reflow: Die geometrischen Eigenschaften des Elements haben sich geändert und der Rendering-Baum muss neu aufgebaut werden. Der Vorgang des Renderns von Baumänderungen wird als Reflow bezeichnet.
  2. Neu zeichnen: Die geometrische Größe des Elements hat sich nicht geändert, aber der CSS-Stil (Hintergrundfarbe oder Farbe) eines Elements hat sich geändert.

Welche Aktionen lösen einen Reflow oder eine Neulackierung aus?

  1. Größe des Fensters ändern
  2. Schriftart ändern
  3. Hinzufügen oder Entfernen von Stylesheets
  4. Der Inhalt ändert sich, z. B. wenn ein Benutzer Text in ein <input/>-Feld eingibt
  5. Klassenattribute manipulieren
  6. Skriptoperationen auf DOM (Hinzufügen, Löschen oder Ändern von DOM-Elementen)
  7. Berechnen der Eigenschaften „offsetWidth“ und „offsetHeight“
  8. Legen Sie den Wert des Stilattributs fest

Wie kann man den Umbruch und die Neuzeichnung reduzieren, um die Leistung von Webseiten zu verbessern?

1. Skriptoperationen an DOM-Elementen

  1. Wenn Sie das DOM-Element auf „display:none“ einstellen, wird während des Einstellvorgangs ein Reflow ausgelöst, es kann jedoch nach Belieben geändert und nach der Änderung angezeigt werden.
  2. Klonen Sie das Element in den Speicher und bearbeiten Sie es. Ersetzen Sie das Element anschließend nach der Änderung.

2. Ändern Sie den Stil des Elements

  1. Versuchen Sie, die Änderungen stapelweise und nicht einzeln vorzunehmen.
  2. Legen Sie vorab die ID und Klasse fest und legen Sie dann den Klassennamen des Elements fest.

3. Wenn Sie einem Element eine Animation hinzufügen, setzen Sie den CSS-Stil des Elements auf position:fixed oder position:absolute. Dadurch wird verhindert, dass das Element neu fließt, nachdem es den Dokumentfluss verlassen hat.

4. Verwenden Sie die Drosselungsfunktion (siehe oben), wenn Sie die Fenstergröße anpassen, Eingabefelder öffnen, Seiten scrollen usw.

HTTP

Browser-Cache

Eine sinnvolle Einstellung des Browser-Cache ist eines der wichtigsten Mittel zur Webseiten-Optimierung.

Ablaufdatum und Cache-Kontrolle

Expires kommt von HTTP1.0 und Cache-Control kommt von HTTP1.1. Wenn beide gleichzeitig eingestellt sind, überschreibt Cache-Control Expires.

  1. „Läuft ab“ gibt das tatsächliche Ablaufdatum und nicht eine Anzahl von Sekunden an. Allerdings weist Expires einige Probleme auf, beispielsweise ist die Serverzeit nicht synchron oder ungenau. Daher ist es besser, die Ablaufzeit in verbleibenden Sekunden und nicht in der absoluten Zeit auszudrücken.
  2. Cache-Control kann den Max-Age-Wert in Sekunden festlegen, um die Ablaufzeit des Caches anzugeben. Beispiel: Cache-Control: max-age=3600.

ETag und Last-Modified

Sowohl ETag als auch Last-Modified werden vom Server in den Antwortheadern zurückgegeben, wobei ETag eine höhere Priorität hat als Last-Modified, was bedeutet, dass der Server dem ETag-Wert Priorität einräumt.

  1. ETag ist eine beliebige Bezeichnung, die einem Dokument angehängt wird. Dabei kann es sich um eine Serien- oder Versionsnummer des Dokuments oder eine Prüfsumme des Dokumentinhalts handeln. Wenn sich das Dokument ändert, ändert sich auch der ETag-Wert. Mit ETag verwandt ist If-None-Match. Wenn der Browser eine Anfrage initiiert, sendet er den ETag-Wert im If-None-Match-Feld an den Server.
  2. „Last-Modified“ ist der Zeitpunkt der letzten Änderung des Dokuments auf dem Server. Mit Last-Modified verwandt ist If-Modified-Since. Wenn der Browser eine Anfrage initiiert, sendet er den Last-Modified-Wert im Feld If-Modified-Since an den Server.

Starkes Caching und ausgehandeltes Caching

Die Cache-Typen sind starker Cache und ausgehandelter Cache. Der Unterschied zwischen beiden besteht darin, dass der starke Cache keine Anfrage an den Server sendet, während der ausgehandelte Cache eine Anfrage sendet. Wenn die Übereinstimmung erfolgreich ist, wird 304 Not Modified zurückgegeben, und wenn die Übereinstimmung nicht erfolgreich ist, wird 200 zurückgegeben. Der Browser überprüft zuerst den starken Cache. Wenn der starke Cache keinen Treffer liefert, führt er eine Prüfung des ausgehandelten Caches durch.

So konfigurieren Sie den Browser-Cache

  1. Fügen Sie der vom Webserver zurückgegebenen Antwort Expires und Cache-Control hinzu.
  2. Konfigurieren Sie Expires und Cache-Control in der Konfigurationsdatei von Nginx oder Apache.

Warum HTTP-Anfragen reduzieren?

Maßnahmen zur Reduzierung von HTTP-Anfragen machen einen großen Teil der Leistungsoptimierung aus, wie z. B.: Verwendung von CSS-Sprites anstelle mehrerer Bildanforderungen, Vermeidung von Bildern mit leerem src, Verwendung von Inline-Bildern, Verwendung von extern verknüpftem CSS und JS, Caching usw.

Der Vorgang von der Eingabe der URL bis zum Laden der Seite ist wie folgt:

  1. DNS-Auflösung
  2. TCP-Verbindung
  3. HTTP-Anforderung und -Antwort
  4. Der Browser rendert die Seite
  5. Schließen Sie die Verbindung

Eine vollständige HTTP-Anfrage muss diese Prozesse durchlaufen, was zeit- und ressourcenintensiv ist, daher ist es notwendig, die Anzahl der Anfragen zu reduzieren.

Quellen:

Hochleistungs-Website-Erstellung vs. Hochleistungs-Website-Erstellung – Erweiterter Leitfaden
Fortgeschrittene JavaScript-Programmierung (dritte Ausgabe)
Definitiver HTTP-Leitfaden
Bewährte Methoden zur Beschleunigung Ihrer Website

Das Obige ist der vollständige Inhalt dieses Artikels. Ich hoffe, er wird für jedermanns Studium hilfreich sein. Ich hoffe auch, dass jeder 123WORDPRESS.COM unterstützen wird.

<<:  Umfassende Analyse des MySql-Master-Slave-Replikationsmechanismus

>>:  Beispiel für die Verwendung von CSS3 zum Anpassen des Stils eines Eingabe-Mehrfachauswahlfelds

Artikel empfehlen

Implementierungsbeispiel für dynamische Routing-Breadcrumbs für Elemente

Zu meistern: localStorage, Komponentenkapselung Ä...

Vor- und Nachteile von MySQL-Indizes und Richtlinien zum Erstellen von Indizes

1. Warum einen Index erstellen? (Vorteile) Dies l...

vue + node + socket io realisiert die Interaktion mehrerer Personen und gibt den gesamten Prozess frei

1. Hintergrund 1. Das Frontend verwendet vue + vu...

Javascript implementiert einfache Navigationsleiste

In diesem Artikel wird der spezifische Code von J...

Perfekte Lösung für keine rc.local-Datei in Linux

Neuere Linux-Distributionen verfügen nicht mehr ü...

Anleitung zur Vermeidung von Docker Win Ping-Fehlern bei Containern

Über Win Docker-Desktop möchte ich mich mit der C...

mysqldump-Parameter, die Sie möglicherweise nicht kennen

Im vorherigen Artikel wurde erwähnt, dass die in ...

Eine kurze Analyse der Unterschiede zwischen Undo, Redo und Binlog in MySQL

Inhaltsverzeichnis Vorwort 【Protokoll rückgängig ...

Beispiele für die Verwendung von HTML-Metadaten

Beispielverwendung Code kopieren Der Code lautet w...

Detaillierte Erklärung zum Anzeigen und Festlegen von Dateiberechtigungen auf dem Mac

Vorwort Um Dateiberechtigungen im Terminal eines ...

Lösen Sie das Problem, dass die CentOS-Zeit der virtuellen VMWare-Maschine nicht mit der Ortszeit übereinstimmt

Die Zeit der virtuellen VM Ware-Maschine CentOS s...

JavaScript-Canvas zum Erzielen von Regentropfeneffekten

In diesem Artikelbeispiel wird der spezifische Co...

Implementierung der Docker-Konfigurationsänderung des Alibaba Cloud-Image-Repository

Das Docker-Repository selbst ist sehr langsam, ab...

Installieren Sie Mininet aus dem Quellcode auf Ubuntu 16.04

Mininet Mininet ist eine leichtgewichtige, softwa...

Implementierung der MySQL-Datentypkonvertierung

1. Problem Es gibt eine Tabelle wie unten gezeigt...