Dieses Mal bringe ich Ihnen die neuesten Front-End-Interviewfragen im Jahr 2018. Wir wissen, dass Interviews ein unverzichtbarer Bestandteil der Front-End-Arbeit sind. Dieses Mal werden die häufigsten Front-End-Interviewfragen sortiert und zusammengefasst, um Ihnen zu helfen durch das Front-End-Interview. Großes Problem. Werfen wir einen Blick darauf.
[Verwandte Empfehlungen: Front-End-Interviewfragen (2020)]
1. Wie optimieren Sie die Dateien und Ressourcen der Website?
1. Reduzieren Sie die Anzahl der HTTP-Anfragen so weit wie möglich, führen Sie CSS, JS und Bilder separat zusammen
2. Verwenden Sie CDN, um die Kommunikationsentfernung zu reduzieren
3
4 .Gzip-komprimierte Dateien aktivieren
5. CSS oben auf der Seite platzieren
6. Skript unten auf der Seite platzieren
7. Vermeiden Sie die Verwendung von Ausdrücken in CSS
8. Platzieren Sie CSS und JS in externen Dateien
9. Reduzieren Sie CSS und JS und reduzieren Sie die Dateigröße
12. Entfernen Sie doppelte Skripte
13. Konfigurieren Sie das Entitäts-Tag ETag
14. Verwenden Sie AJAX-Caching, um Website-Inhalte stapelweise zu laden und lokal zu aktualisieren
2. Warum ist es effektiver, mehrere Domainnamen zur Bereitstellung von Website-Ressourcen zu verwenden? Wie viele Ressourcen kann ein Browser gleichzeitig von einem Domainnamen herunterladen?
1. Statische Inhalte und dynamische Inhalte werden auf separaten Servern gespeichert und zur Verarbeitung von Anfragen werden unterschiedliche Server verwendet. Die Verarbeitung dynamischer Inhalte verarbeitet nur dynamische Inhalte und verarbeitet nichts anderes, um die Effizienz zu verbessern, was das CDN-Caching (Content Distribution Network) komfortabler macht
2. Durchbrechen Sie die Browser-Parallelitätsbeschränkung (Sie können einfach eine G-URL auswählen:
https://
lh4.googleusercontent.com/- si4dh2myPWk/T81YkSiAI/AAAAAAAAQ5o/LlwbBRpp58Q/w497-h373/IMG_20120603_163233.jpg, ersetzen Sie lh4 vorne durch lh3, lh6 usw., und Sie können weiterhin darauf zugreifen es, wie eine Karte. Dies ist sehr wichtig für Websites wie diese, die eine große Anzahl gleichzeitiger Downloads von Bildern erfordern)3. Cookies werden nicht zwischen Domänen übertragen, wodurch Bandbreite gespart wird
3 eine einfache Seite mit Diashow-Effekt
4. Bitte sprechen Sie über Ihr Verständnis der Bedeutung von Webstandards und Standardsetzungsorganisationen.
<!DOCTYPE html>
<html>
<head>
<title>幻灯片</title>
<style type="text/css">
.myDiv{
width:600px;
height:400px;
margin:20px auto;
background-size:over;
background-postion:center;
-webkit-animation-name: "loop";
-webkit-animation-duration:20s;
-webkit-animation-iteration-count:infinite;
}
@-webkit-keyframes "loop"{
0%{background:url(http://img5.duitang.com/uploads/blog/201408/12/20140812150016_8NMUU.jpeg) no-repeat;}
25%{background:url(http://pic29.nipic.com/20130518/9908282_142904524164_2.jpg) no-repeat;}
50%{background:url(http://uploadfile.huiyi8.com/2014/0605/20140605114503719.jpg) no-repeat;}
75%{background:url(http://img3.redocn.com/20100322/Redocn_2010032112222793.jpg) no-repeat;}
100%{background:url(http://uploadfile.huiyi8.com/2014/0605/20140605114447934.jpg)no-repeat;}
}
</style>
</head>Nach dem Login kopieren
Webstandards und Standardsetzungsorganisationen sollen die Entwicklung des Webs „gesünder“ machen. Erstens zwingen sie Browser-Entwickler dazu, einheitliche Standards zu befolgen, und zweitens schränken sie Website-Entwickler ein und reduzieren so die Entwicklung Schwierigkeit und Kosten werden ebenfalls verbessert, und es wird keine Fehler oder Sicherheitsprobleme geben, die durch den Missbrauch von Code verursacht werden, was letztendlich die Benutzerfreundlichkeit der Website verbessert.
5. Bitte erläutern Sie die Vor- und Nachteile von CSS-Animationen und
JavaScript
-Animationen. JS-AnimationNachteile: (1) JavaScript wird im Hauptthread des Browsers ausgeführt, und es gibt andere JavaScript-Skripte, Stilberechnungen, Layouts, Zeichenaufgaben usw., die im Hauptthread ausgeführt werden müssen. Dies stört den Thread und verursacht Blockierungen, die zu Frame-Verlusten führen können.
(2) Die Komplexität des Codes ist höher als die der CSS-Animation
Vorteile: (1) Die Steuerungsfähigkeit von JavaScript-Animationen ist sehr stark und die Animation kann während des Animationswiedergabevorgangs gesteuert werden: Start, Pause, Wiedergabe, Beenden und Abbrechen. Dies ist möglich.
(2) Animationseffekte sind umfangreicher als
CSS3-Animationen
Einige Animationseffekte, wie z. B. Kurvenbewegungen, Aufprallflimmern und Parallaxen-Scrolling-Effekte, können nur durch JavaScript-Animationen vervollständigt werden(3) CSS3 hat Kompatibilitätsprobleme, und JS hat meistens keine KompatibilitätsproblemeCSS-Animation
Nachteile: (1) Die laufende Prozesssteuerung ist schwach und kann keine Ereignisbindung anhängen
Rückruffunktionen
. CSS-Animationen können nur angehalten werden, können keinen bestimmten Zeitpunkt in der Animation finden, können die Animation nicht zur Hälfte umkehren, können die Zeitskala nicht ändern, können keine Rückruffunktionen an bestimmten Positionen hinzufügen oder Wiedergabeereignisse binden und es gibt keinen Fortschrittsbericht (2) Der Code ist lang. Möchte man mit CSS etwas komplexere Animationen umsetzen, wird der CSS-Code am Ende sehr umständlich. Vorteile: (1) Der Browser kann Animationen optimieren.
Browser verwenden einen ähnlichen Mechanismus wie „requestAnimationFrame“ und „setInterval“. Die Hauptvorteile von „requestAnimationFrame“ beim Festlegen von Animationen sind: 1) „requestAnimationFrame“ konzentriert alle DOM-Vorgänge in jedem Frame und führt sie in einem Redraw oder Reflow durch Das Neuzeichnungs- oder Reflow-Zeitintervall folgt eng der Aktualisierungsfrequenz des Browsers. Im Allgemeinen beträgt diese Frequenz 60 Bilder pro Sekunde. 2) requestAnimationFrame wird in versteckten oder unsichtbaren Elementen nicht neu zeichnen oder umfließen, was natürlich eine geringere CPU-, GPU- und Speicherauslastung bedeutet. Erzwingen Sie die Verwendung von Hardwarebeschleunigung (Verbesserung der Animationsleistung durch GPU)
Ich glaube, dass Sie die Methode beherrschen, nachdem Sie den Fall in diesem Artikel gelesen haben. Weitere spannende Informationen finden Sie in anderen verwandten Artikeln zum PHP-Chinesen Webseite!
Verwandte Lektüre:
Neueste Front-End-Interview-Fragen 2018, zwei
Neueste Front-End-Interview-Fragen 2018, Drei
Neueste Front-End-Interviewfragen 2018, vier
Neueste Front-End-Interviewfragen 2018, Fünf
Das obige ist der detaillierte Inhalt vonDie sechs neuesten Fragen zum Front-End-Interview im Jahr 2018. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!
