Programing
Inertia.js v3.1: Rescued Deferred Props e a Transição para uma Stack sem Axios
Published:
•
Duration: 5:23
0:00
0:00
Transcript
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.
Tags
Frontend
web development
php
inertia.js
laravel
spa
performance