Prova de Programação Front-End: Técnicas Avançadas de CSS
Tema: programação front-end. técnicas avançadas de css, lazy loading, sass scss less, grapql, docker e kubernetes e lighthouse
Etapa/Série: 3º ano – Ensino Médio
Disciplina: Formação Técnica e Profissional
Questões: 10
Prova: Programação Front-End – Técnicas Avançadas
Disciplina: Formação Técnica e Profissional
Ano: 3º Ano – Ensino Médio
Instruções:
Responda às questões a seguir, escolhendo a alternativa correta. Cada questão vale 1 ponto.
Questões:
- Questão 1: Considerando as técnicas avançadas de CSS, qual das alternativas descreve melhor o que é o Flexbox?
- A) Uma biblioteca JavaScript para manipulação de DOM.
- B) Uma técnica para criar layouts em duas dimensões com facilidade.
- C) Um pré-processador que facilita a escrita de CSS.
- D) Um sistema de grids fixos que não se adapta a diferentes telas.
- Questão 2: O Lazy Loading é uma técnica utilizada para:
- A) Carregar todos os elementos da página ao mesmo tempo, melhorando a performance.
- B) Adiar o carregamento de recursos não críticos, otimizando a performance inicial da página.
- C) Garantir que as imagens sejam sempre carregadas de forma priorizada.
- D) Remover elementos visuais desnecessários da página para melhorar a estética.
- Questão 3: Qual é a principal vantagem de utilizar Sass ou SCSS em comparação com CSS simples?
- A) Permitem a inclusão de JavaScript diretamente no arquivo CSS.
- B) Operam de maneira mais eficiente e permitem uma organização melhor com variáveis e aninhamento.
- C) Reduzem a necessidade de usar media queries.
- D) São mais fáceis de aprender para iniciantes em programação.
- Questão 4: O que é GraphQL?
- A) Uma linguagem de programação para front-end.
- B) Um sistema de gerenciamento de containers.
- C) Uma ferramenta de consulta de APIs que permite solicitar exatamente os dados necessários.
- D) Um estilo de CSS que facilita a responsividade.
- Questão 5: O que é o Docker?
- A) Uma ferramenta para desenvolvimento de aplicativos desktop.
- B) Um sistema que permite a criação de ambientes isolados a partir de containers.
- C) Uma linguagem de programação voltada para back-end.
- D) Um software para otimização de imagens na web.
- Questão 6: Em um ambiente de desenvolvimento, qual a função do Kubernetes?
- A) Compilar código JavaScript.
- B) Gerenciar e orquestrar containers em larga escala.
- C) Criar layouts responsivos automaticamente.
- D) Aumentar a compressão de recursos front-end.
- Questão 7: O que é Lighthouse e qual sua principal função?
- A) É uma biblioteca CSS que melhora a estética do site.
- B) É uma ferramenta de análise para medir a performance e acessibilidade de websites.
- C) É um tipo de framework JavaScript.
- D) É um sistema de gestão de APIs.
- Questão 8: A técnica de CSS Grid é utilizada para:
- A) Organizar layouts em uma única coluna.
- B) Criar layouts bidimensionais com mais flexibilidade que o Flexbox.
- C) Definir o estilo de fontes em documentos HTML.
- D) Integrar gráficos em páginas web.
- Questão 9: Qual é a principal característica de CSS-in-JS?
- A) Permitir escrever CSS dentro de arquivos de JavaScript e aplicar estilos dinamicamente.
- B) Reduzir a quantidade de código CSS em um projeto.
- C) Criar arquivos CSS estáticos de forma automatizada.
- D) Ajuda no versionamento de arquivos CSS.
- Questão 10: Ao implementar Lazy Loading, qual dos seguintes efeitos você pode esperar ao acessar uma aplicação web?
- A) Aumentar o tempo de carregamento inicial da página.
- B) A página carregará mais rapidamente, exibindo o conteúdo visual prioritário antes de outros elementos.
- C) Diminuição da quantidade de imagens exibidas na página.
- D) Aumentar o uso de largura de banda.
Gabarito:
- B: O Flexbox simplifica a criação de layouts, permitindo o alinhamento e a distribuição de espaço entre itens em um contêiner.
- B: O Lazy Loading é uma técnica para diminuir o tempo de carregamento inicial, carregando apenas o que é necessário e adiando o resto.
- B: Sass e SCSS oferecem recursos avançados como variáveis, mixins e aninhamento, facilitando a manutenção do CSS.
- C: GraphQL é uma linguagem para consultar APIs, permitindo que os desenvolvedores especifiquem exatamente quais dados precisam.
- B: Docker permite criar, implantar e executar aplicações em containers, proporcionando ambientes isolados para cada aplicação.
- B: Kubernetes facilita a orquestração de containers, permitindo escalar, monitorar e gerenciar aplicações conteinerizadas.
- B: Lighthouse analisa websites, fornecendo relatórios de performance, acessibilidade e SEO.
- B: CSS Grid permite criar layouts complexos de forma mais flexível que o Flexbox, facilitando o design de interfaces.
- A: CSS-in-JS combina CSS com JavaScript, permitindo estilos dinâmicos que podem ser definidos e alterados em tempo real.
- B: Com Lazy Loading, o carregamento inicial da página melhora, pois apenas o conteúdo visível é carregado primeiramente, economizando recursos.
Esta prova visa não apenas avaliar o conhecimento técnico dos alunos sobre programação front-end, mas também instigá-los a refletir sobre a importância das técnicas discutidas no desenvolvimento de aplicações modernas.
