Frontend

Πώς μπορούμε να μάθουμε αν υπάρχουν προβλήματα με τη φόρμα σε παραγωγή, αν σταματήσει να λειτουργεί (π.χ., δεν ολοκληρώνει την εγγραφή);

Η μέτρηση TTFB (Time To First Byte) — πώς μπορεί να μειωθεί κατά τη διάρκεια του SSR, ποια είναι η φύση των πτώσεων και πώς μπορεί να βελτιωθεί; Περιγράψτε τι συμβαίνει από τη στιγμή που πατάτε Enter μέχρι να εμφανιστεί κάτι στην οθόνη.

λειτουργία promiseWithResolve() { // Δεν υλοποιήθηκε } const { resolve, promise } = promiseWithResolve(); promise.then((v) => console.log(v)) setTimeout(() => resolve(13), 10)

Υλοποιήστε τη λειτουργία callLimit, η οποία περιορίζει τον αριθμό των κλήσεων της δοθείσας λειτουργίας σε ένα καθορισμένο όριο, και παρέχει επίσης τη μέθοδο reset για την επαναφορά του μετρητή.

Πρέπει να γράψετε μια συνάρτηση sum που, όταν καλείται με ένα όρισμα, να συσσωρεύει έναν αριθμό, και όταν καλείται χωρίς όρισμα, να επιστρέφει τον συσσωρευμένο αριθμό. Για παράδειγμα: sum(2)(1)(2)() πρέπει να επιστρέφει 5.

Φανταστείτε μια κατάσταση: λίγο πριν την κυκλοφορία, βρίσκετε ένα σφάλμα που κάνει μια λειτουργία να μην λειτουργεί σωστά. Η κυκλοφορία δεν μπορεί να καθυστερήσει, αλλά καταλαβαίνετε ότι κάτι δεν λειτουργεί σωστά. Τι θα κάνατε σε μια τέτοια κατάσταση;

Ο χρήστης πάτησε το κουμπί, ήρθε ένα μεγάλο σύνολο δεδομένων από το backend και η οθόνη πάγωσε. Ποιο θα μπορούσε να είναι το πρόβλημα και πώς να το λύσετε;

Εφαρμόστε τον τύπο σε TypeScript για επικύρωση URL, ώστε να επιτρέπονται μόνο σωστά URLs του τύπου: βασική domain + διαδρομή (users/orders/messages) + μέθοδος (get/update/delete/ban). Τυχαίες συμβολοσειρές πρέπει να προκαλούν σφάλμα μεταγλώττισης.

Ας υποθέσουμε ότι έχουμε ένα ηλεκτρονικό κατάστημα, όπου μια λίστα προϊόντων εμφανίζεται με 50 αντικείμενα ανά σελίδα, με σελιδοποίηση. Όταν ο χρήστης μεταβαίνει στη δεύτερη σελίδα, ειδικά στο τηλέφωνο, εμφανίζονται μεγάλα λευκά τετράγωνα αντί για εικόνες για μεγάλο χρονικό διάστημα. Πώς μπορούμε να κάνουμε τις εικόνες να εμφανίζονται πιο γρήγορα;

Έχεις δουλέψει με CI/CD, ίσως έχεις δημιουργήσει Docker κοντέινερ ή ρυθμίσει pipelines;

export function foo(o, arr) { return arr.reduce((a, x) => { // αν (o.hasOwnProperty(x)) a[x] = o[x]; if (o[x]) a[x] = o[x]; return a; }, {}); } const obj = {a: 's'} foo(obj, ['a'])

Βεβαιωθείτε ότι το στοιχείο UserName εμφανίζει το νέο όνομα χρήστη μετά την επιτυχή υποβολή της φόρμας.

Ας υποθέσουμε ότι βλέπουμε ότι τα στυλ φορτώνουν αργά κάθε φορά που ένας χρήστης επισκέπτεται τον ιστότοπο ή ανανεώνει τη σελίδα. Το να κάνεις το κρίσιμο CSS είναι δύσκολο. Τι πρέπει να ελέγξουμε συγκεκριμένα σχετικά με το CSS και γενικά για οποιοδήποτε στατικό περιεχόμενο;

Κατάλαβε τι κάνει αυτός ο κώδικας και πώς μπορεί να χρησιμοποιηθεί. Υπάρχει ένας παρόμοιος βοηθός στο lodash — αν τον αναγνωρίζεις, μπορείς απλά να αναφέρεις το όνομά του.

Πώς να λάβετε δεδομένα από το API μέσα σε ένα thunk, λαμβάνοντας υπόψη ότι το API περνάει ως επιπλέον όρισμα στο middleware thunk;

Έχεις δουλέψει με SSR; Τι έκανες — SSR, SSG ή απλά χρησιμοποιούσες το Next.js;

Ένας χρήστης παραπονιέται ότι μερικές φορές το κουμπί δεν ανταποκρίνεται, αλλά το πρόβλημα δεν αναπαράγεται τοπικά. Ποια είναι τα βήματά σου για αποσφαλμάτωση; Ποιες μπορεί να είναι οι αιτίες;

Τι μπορεί να μπλοκάρει τη διαδικασία ανάλυσης HTML;

Η απάντηση API μπορεί να περιέχει σφάλμα που πρέπει να εμφανίζεται στον χρήστη δίπλα στο αντίστοιχο πεδίο.

Έχετε ακούσει για το Web Vitals και συγκεκριμένα για τη μέτρηση FCP; Πείτε μας τι γνωρίζετε για τις μετρήσεις Web Vitals.