Panoramica della scheda Rendering

Sofia Emelianova

Scopri una raccolta di opzioni che influiscono sul rendering dei contenuti web con questa panoramica delle funzionalità della scheda Rendering in DevTools.

Panoramica

La scheda Rendering ti consente di:

• Scopri i problemi di prestazioni di rendering. Ritocco di singoli elementi, cambiamenti di layout, livelli e riquadri, problemi di scorrimento, statistiche sul rendering e Core Web Vitals.
• Emula le funzionalità dei contenuti multimediali del CSS. Testa il rendering delle pagine con funzionalità multimediali CSS diverse senza specificarle manualmente nel codice o nell'ambiente di test.
• Applicare altri effetti utili. Evidenziare i frame degli annunci, emulare lo stato attivo su una pagina, disattivare i caratteri e i formati delle immagini locali, attivare un tema scuro automatico ed emulare le carenze visive.

Apri la scheda Rendering

Per aprire la scheda Rendering:

1. Apri DevTools.

2. Premi Comando+Maiusc+P (Mac) o Ctrl+Maiusc+P (Windows, Linux, ChromeOS) per aprire il menu di comando.

   

3. Inizia a digitare rendering, seleziona Mostra rendering e premi Invio. DevTools mostra la scheda Rendering nella parte inferiore della finestra.

Punto chiave: oltre ad aprire la scheda Rendering, puoi anche utilizzare il menu Comando per cercare e attivare qualsiasi opzione. Prova a digitare il nome di un'opzione, ad esempio emulate.

In alternativa, puoi aprire la scheda Rendering nei seguenti modi:

• Premi Esc per aprire il riquadro laterale e, nell'angolo in alto a sinistra, fai clic su Altri strumenti > Rendering.
• Nell'angolo in alto a destra, fai clic su Altre opzioni > Altri strumenti > Rendering.