Inertia.js v3.1: Rescued Deferred Props e a Transição para uma Stack sem Axios
Transcrição
Apresentadora
Juliana Santos E aí, pessoal, bem-vindos de volta ao Allur! Eu sou a Juliana Santos e é um prazer ter vocês aqui para mais um mergulho no universo do desenvolvimento. Se você, como eu, é fã daquele ecossistema que faz o PHP brilhar e o front-end não parecer um bicho de sete cabeças, o episódio de hoje é um prato cheio.
Apresentadora
Juliana Santos Hoje eu recebo aqui no Allur o Rodrigo Menezes. O Rodrigo é Tech Lead, desenvolvedor Full Stack com uma bagagem gigante em projetos de alta escala usando Laravel e Vue, e ele tem acompanhado de perto essa evolução do Inertia. Rodrigo, seja muito bem-vindo ao Allur, cara! Prazer enorme falar contigo.
Convidado
Rodrigo Menezes Oi, Juliana! Valeu demais pelo convite. O prazer é todo meu. Sou ouvinte assíduo do Allur, então estar aqui do outro lado do microfone hoje, falando de uma ferramenta que eu uso todo santo dia, é massa demais! Vamos lá, que tem muita coisa boa nessa v3.1 pra gente debater.
Apresentadora
Juliana Santos Com certeza! E Rodrigo, pra gente começar do começo: o Inertia sempre se vendeu como essa "ponte" entre o back-end e o front-end, né? Sem precisar de uma API REST ou GraphQL separada. Na sua visão, como essa versão 3.1 consolida essa ideia de "Monólito Moderno" que a equipe do Laravel tanto defende?
Convidado
Rodrigo Menezes Cara, a palavra-chave aqui é maturidade. O Inertia nasceu com aquela promessa de: "Ei, você não precisa sofrer gerenciando estado complexo no front se o seu back já sabe tudo o que a página precisa". Mas, conforme as aplicações cresceram, a gente começou a sentir falta de algumas coisas de resiliência e, principalmente, de performance de carregamento.
Apresentadora
Juliana Santos Isso é muito real. E falando em agilidade, um dos destaques dessa versão são as *Rescued Deferred Props*. Eu lembro que quando as *Deferred Props* chegaram, foi uma revolução, porque a gente podia carregar o "grosso" da página e deixar os dados pesados pra depois, melhorando o LCP. Mas e quando esse "depois" dava errado? Explica pra gente o que mudou agora.
Convidado
Rodrigo Menezes Pois é, esse era o "calcanhar de Aquiles". Imagina que você tem um dashboard. A estrutura carrega rápido, mas aquele gráfico pesado que vem via *Deferred Prop* falha porque o banco de dados deu um timeout ou a rede oscilou. Antes, o usuário ficava num estado meio "limbo" ou o componente quebrava porque esperava um dado que nunca chegou.
Apresentadora
Juliana Santos Nossa, isso ajuda demais na experiência do usuário, né? Tira aquela sensação de "app quebrado". Agora, Rodrigo, vamos falar da polêmica, ou melhor, da grande mudança estrutural: o fim da era Axios no Inertia. Muita gente tomou um susto, tipo: "Como assim o Axios não é mais obrigatório?". Por que a equipe do Jonathan Reinink tomou essa decisão de migrar para um cliente XHR nativo?
Convidado
Rodrigo Menezes Cara, essa foi a "cartada de mestre" dessa versão. O Axios é maravilhoso, ele carregou o ecossistema JS nas costas por anos. Mas, pro Inertia, ele começou a se tornar um "peso extra". O Inertia tem necessidades muito específicas: ele precisa lidar com o CSRF do Laravel, ele precisa interpretar os redirecionamentos 303 de um jeito próprio, ele tem todo um esquema de headers customizados.
Apresentadora
Juliana Santos Massa! Mas aí vem a dúvida que muita gente deve estar tendo agora: e os meus projetos legados? Se eu atualizar pro 3.1 e eu usava o Axios pra fazer chamadas manuais pra outras APIs dentro dos meus componentes, vai quebrar tudo?
Convidado
Rodrigo Menezes Essa é a pergunta de um milhão de dólares! (risos). A resposta curta é: não necessariamente, mas você precisa ficar de olho. O Inertia não "proíbe" o Axios. Se você faz chamadas manuais pro seu back-end usando o objeto global do Axios, você só precisa garantir que ele continue instalado como uma dependência direta no seu `package.json`.
Apresentadora
Juliana Santos Entendi, é mais uma questão de organização de dependências mesmo. E falando em performance, você mencionou o *bundle size*. Na prática, em aplicações mobile ou pra quem se preocupa muito com SEO, essa "Slimmer Stack" faz uma diferença perceptível?
Convidado
Rodrigo Menezes Com certeza, Ju. No mundo web de hoje, cada KB conta. Especialmente quando a gente fala de dispositivos móveis em redes 3G ou 4G instáveis. Quando você reduz o JavaScript total, o navegador interpreta a página mais rápido.
Apresentadora
Juliana Santos Cara, "proteger o desenvolvedor de si mesmo" é uma frase excelente! (risos). Pra gente fechar, Rodrigo, qual a sua principal dica pra quem está olhando pro Inertia.js v3.1 agora e quer começar a implementar essas melhorias, especialmente as Rescued Props?
Convidado
Rodrigo Menezes Minha dica é: comece revisando os pontos de lentidão da sua app. Aquelas tabelas pesadas ou relatórios. Use o *Deferred Props* para carregar a casca da página rápido e, agora, não tenha medo da falha! Implemente o tratamento de erro com o `failed` que a v3.1 trouxe. Isso vai elevar o nível profissional do seu projeto.
Apresentadora
Juliana Santos Sensacional, Rodrigo! Papo muito esclarecedor. Eu confesso que já estou coçando os dedos pra abrir um projeto aqui e testar esse tratamento de falhas nas props adiadas. Muito obrigada por compartilhar sua expertise com a gente hoje!
Convidado
Rodrigo Menezes Eu que agradeço, Juliana! Foi um prazer bater esse papo. E pessoal, não tenham medo de atualizar. O ecossistema Laravel/Inertia nunca esteve tão sólido. Valeu!
Apresentadora
Juliana Santos É isso aí, pessoal! O Inertia.js v3.1 chegou para mostrar que o monólito moderno está mais vivo do que nunca, mais leve e muito mais resiliente. Se você quer saber mais, os links para as novidades e para o blog do Laravel estão na descrição deste episódio.