# Recursos avançados do Next.js (React / Next.js) > Otimização de imagens, otimização de fontes, otimização de scripts, analytics, edge runtime, recursos experimentais - 24 perguntas de entrevista - Senior - [Perguntas de entrevista: React / Next.js](https://sharpskill.dev/pt/technologies/react-next/perguntas-entrevista.md) ## 1. Qual é a principal vantagem de usar next/image em comparação com uma tag img padrão? **Resposta** next/image otimiza automaticamente as imagens gerando múltiplos tamanhos e formatos modernos (WebP, AVIF), aplica lazy loading por padrão e melhora as Web Vitals ao prevenir o Cumulative Layout Shift através do cálculo automático de dimensões. Ao contrário de uma tag img padrão que carrega a imagem original, next/image serve o tamanho ideal com base no viewport e na densidade de pixels do dispositivo. Essa abordagem reduz significativamente o tempo de carregamento e o consumo de largura de banda. ## 2. Quando usar a propriedade priority em um componente next/image? **Resposta** A propriedade priority desativa o lazy loading e pré-carrega a imagem imediatamente, o que é crucial para imagens above-the-fold que impactam o Largest Contentful Paint (LCP). Sem priority, essas imagens críticas seriam carregadas com lazy loading, atrasando o LCP e degradando os Core Web Vitals. Use priority apenas para 1-2 imagens visíveis no carregamento inicial da página, tipicamente hero images ou banners principais. ## 3. Qual configuração do next/image permite servir imagens de um domínio externo? **Resposta** A propriedade remotePatterns no next.config.js permite definir domínios externos autorizados para servir imagens, com controle granular sobre protocolo, hostname, porta e pathname. Essa abordagem substitui a propriedade domains (obsoleta) e oferece segurança aprimorada ao limitar com precisão as fontes autorizadas. Configurar remotePatterns evita erros 400 ao carregar imagens hospedadas em CDNs ou serviços de terceiros como Cloudinary ou AWS S3. ## Mais 21 perguntas disponiveis - Qual é a diferença entre fill e responsive para o sizing do next/image? - Como otimizar imagens estáticas importadas localmente com next/image? Cadastre-se gratis: https://sharpskill.dev/pt/login ## Outros temas de entrevista React / Next.js - [Fundamentos de JavaScript](https://sharpskill.dev/pt/technologies/react-next/perguntas-entrevista/javascript-essentials.md): 25 perguntas, Junior - [Fundamentos do React](https://sharpskill.dev/pt/technologies/react-next/perguntas-entrevista/react-fundamentals.md): 20 perguntas, Junior - [React Hooks](https://sharpskill.dev/pt/technologies/react-next/perguntas-entrevista/react-hooks.md): 22 perguntas, Junior - [Ciclo de vida dos componentes](https://sharpskill.dev/pt/technologies/react-next/perguntas-entrevista/component-lifecycle.md): 18 perguntas, Junior - [React Router](https://sharpskill.dev/pt/technologies/react-next/perguntas-entrevista/react-router.md): 20 perguntas, Junior - [Gerenciamento de estado com Context](https://sharpskill.dev/pt/technologies/react-next/perguntas-entrevista/state-management-context.md): 18 perguntas, Junior - [Formulários e Controlled Components](https://sharpskill.dev/pt/technologies/react-next/perguntas-entrevista/forms-controlled-components.md): 20 perguntas, Mid-Level - [Busca de dados e API](https://sharpskill.dev/pt/technologies/react-next/perguntas-entrevista/fetching-data-api.md): 20 perguntas, Mid-Level - [React Query (TanStack Query)](https://sharpskill.dev/pt/technologies/react-next/perguntas-entrevista/react-query-tanstack.md): 20 perguntas, Mid-Level - [Styling & CSS-in-JS](https://sharpskill.dev/pt/technologies/react-next/perguntas-entrevista/styling-css-in-js.md): 18 perguntas, Mid-Level - [Fundamentos do Next.js](https://sharpskill.dev/pt/technologies/react-next/perguntas-entrevista/nextjs-fundamentals.md): 25 perguntas, Mid-Level - [TypeScript com React](https://sharpskill.dev/pt/technologies/react-next/perguntas-entrevista/typescript-react.md): 20 perguntas, Mid-Level - [Data Fetching no Next.js](https://sharpskill.dev/pt/technologies/react-next/perguntas-entrevista/nextjs-data-fetching.md): 24 perguntas, Mid-Level - [Server Actions do Next.js](https://sharpskill.dev/pt/technologies/react-next/perguntas-entrevista/nextjs-server-actions.md): 20 perguntas, Mid-Level - [Roteamento e Navegação no Next.js](https://sharpskill.dev/pt/technologies/react-next/perguntas-entrevista/nextjs-routing-navigation.md): 22 perguntas, Mid-Level - [API Routes do Next.js](https://sharpskill.dev/pt/technologies/react-next/perguntas-entrevista/nextjs-api-routes.md): 20 perguntas, Mid-Level - [Metadata & SEO no Next.js](https://sharpskill.dev/pt/technologies/react-next/perguntas-entrevista/nextjs-metadata-seo.md): 18 perguntas, Mid-Level - [Middleware e Auth no Next.js](https://sharpskill.dev/pt/technologies/react-next/perguntas-entrevista/nextjs-middleware-auth.md): 22 perguntas, Mid-Level - [Testes em React](https://sharpskill.dev/pt/technologies/react-next/perguntas-entrevista/react-testing.md): 20 perguntas, Mid-Level - [Zustand State Management](https://sharpskill.dev/pt/technologies/react-next/perguntas-entrevista/zustand-state-management.md): 18 perguntas, Mid-Level - [Otimização de Performance React](https://sharpskill.dev/pt/technologies/react-next/perguntas-entrevista/react-performance-optimization.md): 22 perguntas, Senior - [Error Boundaries & Error Handling](https://sharpskill.dev/pt/technologies/react-next/perguntas-entrevista/react-error-boundaries.md): 18 perguntas, Senior - [Advanced React Patterns](https://sharpskill.dev/pt/technologies/react-next/perguntas-entrevista/advanced-react-patterns.md): 20 perguntas, Senior - [Deploy e Produção com Next.js](https://sharpskill.dev/pt/technologies/react-next/perguntas-entrevista/nextjs-deployment-production.md): 20 perguntas, Senior - [Architecture & Design Patterns](https://sharpskill.dev/pt/technologies/react-next/perguntas-entrevista/react-architecture-patterns.md): 22 perguntas, Senior - [React Server Components](https://sharpskill.dev/pt/technologies/react-next/perguntas-entrevista/react-server-components.md): 26 perguntas, Senior - [Internacionalização do Next.js](https://sharpskill.dev/pt/technologies/react-next/perguntas-entrevista/nextjs-internationalization.md): 20 perguntas, Senior - [React Security & Boas Práticas](https://sharpskill.dev/pt/technologies/react-next/perguntas-entrevista/react-security-best-practices.md): 22 perguntas, Senior --- Source: SharpSkill (https://sharpskill.dev), tech interview preparation for your real stack. HTML version of this page: https://sharpskill.dev/pt/technologies/react-next/perguntas-entrevista/nextjs-advanced-features