O ESLint é aquele colega chato que reclama de tudo, mas que no fundo só quer que o seu código seja perfeito.
O ESLint é aquele colega chato que reclama de tudo, mas que no fundo só quer que o seu código seja perfeito.
Toda página web, por trás de cada clique, botão e animação, é sustentada por uma estrutura invisível L uma árvore.
Essa árvore é o DOM, e sua versão otimizada é o Virtual DOM.
Mas afinal:
👉 O que é exatamente essa “árvore”?
👉 Por que ela existe?
👉 Como React, Vue e outros frameworks lidam com ela?
👉 E o que realmente acontece dentro do navegador quando você altera algo na tela?
Prepare-se: este post vai abrir o DOM por dentro, com profundidade e clareza.
Imagine que você tem uma lista de elementos na tela, por exemplo, uma lista de amigos, produtos ou tarefas.
Você muda a ordem desses itens, e... o navegador atualiza tudo em milissegundos.
Mas já se perguntou como o framework sabe o que realmente mudou?
💡 É aí que entra o algoritmo de diffing, e dentro dele, uma joia da computação chamada LIS (Longest Increasing Subsequence).
“Diffing” vem de diff, que significa “diferença”.
É o processo de comparar duas versões de algo para descobrir o que mudou.
Nos frameworks modernos como React e Vue, esse “algo” é o Virtual DOM, uma cópia leve do DOM real, guardada na memória.
O estado muda, por exemplo, um contador vai de 1 para 2.
O framework cria uma nova versão do Virtual DOM com esse novo valor.
Ele compara (faz o diffing) entre o novo e o antigo Virtual DOM.
Descobre o que mudou, ou seja, só o número 1 → 2.
Atualiza apenas esse pedacinho no DOM real, sem recarregar tudo.
Imagine que você entra em https://minhaloja.com/produtos e, em menos de um segundo, a página inteira já aparece renderizada, lista de produtos, imagens, preços... tudo visível, mesmo que o JavaScript ainda nem tenha terminado de carregar.
✨ Isso é SSR, Server-Side Rendering em ação.
Mas o que realmente acontece nos bastidores?
Como o servidor consegue "montar" uma interface antes mesmo do navegador?
E por que isso muda completamente SEO, performance e arquitetura de uma aplicação moderna?
Neste artigo, vamos mergulhar fundo:
➡️ Entender como o SSR funciona internamente;
➡️ Comparar React (Next.js) e Vue (Nuxt);
➡️ Explorar hidratação, caching, edge runtimes e arquitetura moderna.
Tudo isso de forma técnica, acessível e visual.
“Air o quê???”
Calma. Vamos entender do zero!!
O Airflow é uma ferramenta que serve pra automatizar tarefas que precisam acontecer em uma certa ordem, em certos horários, com controle, logs e alertas.
Pensa nele como um gerente de tarefas automáticas.
Ele não é backend, não é API, não é banco, é quem orquestra o que precisa acontecer, quando e como.