[{"data":1,"prerenderedAt":7557},["ShallowReactive",2],{"index":3,"featured-projects":126,"palette-projects":227,"latest-posts":313,"palette-posts":7549},{"id":4,"about":5,"contact":11,"education":27,"experience":31,"extension":53,"hero":54,"meta":69,"seo":70,"stack":73,"stem":113,"testimonials":114,"__hash__":125},"index\u002Findex.yml",{"title":6,"paragraphs":7},"Sobre mim",[8,9,10],"Sou desenvolvedor front-end especializado em **Nuxt**, com base sólida em Vue, TypeScript e Tailwind CSS. Do lado do servidor, trabalho com Node.js, AdonisJS, Supabase, Lua e MySQL.","Gosto de produto. Desenho o fluxo, escrevo o código e cuido do deploy, com atenção a performance, acessibilidade e Web Vitals. Código legível, testável e fácil de evoluir.","Sou colaborador da comunidade Nuxt e autor da **Paper UI**, uma biblioteca de componentes com estética desenhada à mão.",{"title":12,"description":13,"links":14},"Vamos construir algo juntos?","Estou aberto a projetos freelance e novas oportunidades. Me chama no WhatsApp, por e-mail ou no LinkedIn.",[15,19,23],{"label":16,"to":17,"icon":18},"felipecoliveira.dev@gmail.com","mailto:felipecoliveira.dev@gmail.com","i-lucide-mail",{"label":20,"to":21,"icon":22},"LinkedIn","https:\u002F\u002Fwww.linkedin.com\u002Fin\u002Ffelipe--\u002F","i-simple-icons-linkedin",{"label":24,"to":25,"icon":26},"GitHub","https:\u002F\u002Fgithub.com\u002FFelipeO16","i-simple-icons-github",{"course":28,"school":29,"period":30},"Ciência da Computação","Universidade Estácio de Sá","2023 — atual",[32,38,42,48],{"period":33,"role":34,"company":35,"url":36,"current":37},"ago 2025 — atual","Desenvolvedor Front-end","winx.ai","https:\u002F\u002Fwinx.ai\u002F",true,{"period":39,"role":34,"company":40,"url":41},"jun 2023 — ago 2025","Tradeup","https:\u002F\u002Fwww.tradeupgroup.com\u002F",{"period":43,"role":44,"company":45,"url":46,"description":47},"jun 2019 — jun 2023","Sócio e CTO","Narnia RP (FiveM)","https:\u002F\u002Ffivem.net\u002F","Infraestrutura, back-end em Lua e interfaces em Vue para um servidor de GTA RP com mais de 80 mil usuários.",{"period":49,"role":50,"company":51,"url":52},"jul 2016 — ago 2018","Desenvolvedor de produtos","Selene S\u002FA","https:\u002F\u002Fwww.selene.com.br\u002F","yml",{"eyebrow":55,"title":56,"highlight":57,"description":58,"stats":59},"Desenvolvedor Front-end · Nuxt & Vue","Interfaces que viram","produto.","Sou Felipe Oliveira. Construo aplicações web com Nuxt, Vue e TypeScript, de SaaS para restaurantes a jogos que rodam no navegador. Hoje sou dev front-end na winx.ai.",[60,63,66],{"value":61,"label":62},"7+","anos escrevendo código",{"value":64,"label":65},"10+","projetos em produção",{"value":67,"label":68},"80k+","usuários no Narnia RP",{},{"title":71,"description":72},"Felipe Oliveira — Desenvolvedor Front-end","Desenvolvedor Front-end especializado em Nuxt, Vue e TypeScript. Construo produtos web, SaaS e jogos no navegador, do protótipo ao deploy.",[74,77,80,83,86,89,92,95,98,101,104,107,110],{"label":75,"icon":76},"Nuxt","i-simple-icons-nuxt",{"label":78,"icon":79},"Vue","i-simple-icons-vuedotjs",{"label":81,"icon":82},"TypeScript","i-simple-icons-typescript",{"label":84,"icon":85},"Tailwind CSS","i-simple-icons-tailwindcss",{"label":87,"icon":88},"Nuxt UI","i-lucide-layout-grid",{"label":90,"icon":91},"Supabase","i-simple-icons-supabase",{"label":93,"icon":94},"Node.js","i-simple-icons-nodedotjs",{"label":96,"icon":97},"AdonisJS","i-simple-icons-adonisjs",{"label":99,"icon":100},"React","i-simple-icons-react",{"label":102,"icon":103},"three.js","i-simple-icons-threedotjs",{"label":105,"icon":106},"Vitest","i-simple-icons-vitest",{"label":108,"icon":109},"Lua","i-simple-icons-lua",{"label":111,"icon":112},"MySQL","i-simple-icons-mysql","index",[115,120],{"quote":116,"name":117,"role":118,"avatar":119},"Felipe é um profissional excepcional — proativo, comunicativo e com grande capacidade técnica. Graças às suas contribuições, conseguimos atingir mais de 300 usuários ativos e formar uma comunidade com mais de 1.500 jogadores na nossa cidade de GTA RP. Seu trabalho em bibliotecas de componentes e features inovadoras foi essencial para o sucesso do projeto.","Clayton Magalhães","Software Engineer no Mercado Livre","\u002Fclayton.png",{"quote":121,"name":122,"role":34,"avatar":123,"url":124},"Tenho o prazer de recomendar Felipe, um desenvolvedor extraordinário com expertise em Lua, JavaScript, Vue.js, Node.js, MySQL e Git. É altamente dedicado, focado em resultados e aprende muito rápido. Sua atenção meticulosa ao backlog e o compromisso com as entregas o tornam essencial no time.","Jhonatan Serafim","\u002Fjhonatan.jpg","https:\u002F\u002Fwww.linkedin.com\u002Fin\u002Fjhonatan-serafim\u002F","qQPTKd_gZsniUWXHmpGyswJvfohW3TGpAVZTNKxswk8",[127,145,160,172,187,200,215],{"id":128,"title":129,"accent":130,"description":131,"device":132,"extension":53,"featured":37,"image":133,"kind":134,"meta":135,"repo":136,"stem":137,"tagline":138,"tags":139,"url":142,"year":143,"__hash__":144},"projects\u002Fprojects\u002F01.fluxxi.yml","Fluxxi","#0f766e","Comandas por mesa que enviam pedidos direto para cozinha e bar, estoque com alertas, fechamento de caixa por turno, equipe com comissões e relatórios em PDF. Um produto completo, com planos pagos e versão PWA para o celular.","desktop","\u002Fprojects\u002Ffluxxi.png","Produto",{},null,"projects\u002F01.fluxxi","SaaS de gestão para bares e restaurantes.",[75,87,90,140,141],"Pinia","GSAP","https:\u002F\u002Fwww.fluxxi.com.br\u002F",2026,"_1Q9DQI2p5piM84tbn1QZM3GNYJ2sAsr-h1syMorkiQ",{"id":146,"title":147,"accent":148,"description":149,"device":132,"extension":53,"featured":37,"image":150,"kind":151,"meta":152,"repo":136,"stem":153,"tagline":154,"tags":155,"url":158,"year":143,"__hash__":159},"projects\u002Fprojects\u002F02.lifetour.yml","LifeTour","#f5b301","Jogo de tabuleiro inspirado no Business Tour, em Phaser 3 e WebGL. Motor de regras desacoplado da interface, bots com IA, modo online, editor de mapas e balanceamento validado com milhares de partidas simuladas.","\u002Fprojects\u002Flifetour.png","Pessoal",{},"projects\u002F02.lifetour","Board game de negócios isométrico, jogável no navegador.",[156,81,157,90,105],"Phaser 3","Vite","https:\u002F\u002Flifetour-ivory.vercel.app\u002F","yLAYCM2fRZtFZ-zkolG0zvY-NpM_hsP-_G9xowC72MI",{"id":161,"title":162,"accent":163,"description":164,"device":132,"extension":53,"featured":37,"image":165,"kind":151,"meta":166,"repo":136,"stem":167,"tagline":168,"tags":169,"url":170,"year":143,"__hash__":171},"projects\u002Fprojects\u002F03.faictory.yml","Faictory","#facc15","Inspirado em Factorio. Minere recursos, monte cadeias de produção com esteiras, braços robóticos e máquinas, e explore uma ilha gerada proceduralmente. Renderização em three.js com HUD em Nuxt UI.","\u002Fprojects\u002Ffaictory.png",{},"projects\u002F03.faictory","Jogo 3D de automação industrial no navegador.",[75,102,87,81],"https:\u002F\u002Ffaictory.vercel.app\u002F","LxtgDr3OCa8rqhWUiwzYIi1vm7kX4iI9OWJEfoeVNts",{"id":173,"title":174,"accent":175,"description":176,"device":177,"extension":53,"featured":37,"image":178,"kind":151,"meta":179,"repo":136,"stem":180,"tagline":181,"tags":182,"url":185,"year":143,"__hash__":186},"projects\u002Fprojects\u002F04.myfin.yml","MyFin","#c6f16b","PWA instalável para controlar o dinheiro do dia a dia e as vendas a prazo, com parcelas, cobrança pelo WhatsApp e lembretes. Os dados ficam no aparelho e funcionam offline, com sincronização cifrada opcional.","mobile","\u002Fprojects\u002Fmyfin.png",{},"projects\u002F04.myfin","Finanças pessoais e vendas fiado, offline-first.",[99,81,183,184,105],"PWA","IndexedDB","https:\u002F\u002Fmyfin-wine.vercel.app\u002F","MnKq_n6lh7yoUZeI27pDEp0ziBT6nb62qi8W7SDudXU",{"id":188,"title":189,"accent":136,"description":190,"device":132,"extension":53,"featured":37,"image":191,"kind":192,"meta":193,"repo":136,"stem":194,"tagline":195,"tags":196,"url":198,"year":143,"__hash__":199},"projects\u002Fprojects\u002F05.imperiodabeleza.yml","Império da Beleza","Site com serviços e pacotes, agendamento com escolha de horário, área do cliente e programa de fidelidade. Painel admin com agenda, clientes, financeiro e promoções, e lembretes automáticos pelo WhatsApp.","\u002Fprojects\u002Fimperiodabeleza.png","Cliente",{},"projects\u002F05.imperiodabeleza","Agendamento online e gestão para salão de beleza.",[75,87,90,197],"WhatsApp API","https:\u002F\u002Fimperiodabeleza.vercel.app\u002F","dYH4YyKfMy-yjcJrhnW0kLPMoyHKGsgidRamwvyJE48",{"id":201,"title":202,"accent":136,"description":203,"device":132,"extension":53,"featured":37,"image":204,"kind":205,"meta":206,"repo":136,"stem":207,"tagline":208,"tags":209,"url":212,"year":213,"__hash__":214},"projects\u002Fprojects\u002F06.paper-ui.yml","Paper UI","Design system com estética de desenho à mão, em Vue 3 e Nuxt, com TypeScript e Tailwind CSS. Hoje na versão 2.0, com documentação própria.","\u002Fprojects\u002Fpaper-ui.png","Open source",{},"projects\u002F06.paper-ui","Biblioteca de componentes hand-drawn para Nuxt.",[75,210,81,211],"Design System","Tailwind","https:\u002F\u002Fpaper-docs.nuxt.space\u002F",2025,"Oq9ZcBuOfRs5t6tO_vpEkYVnkeSZBMolKc7lh_K1aN0",{"id":216,"title":217,"accent":136,"description":218,"device":132,"extension":53,"featured":37,"image":219,"kind":192,"meta":220,"repo":136,"stem":221,"tagline":222,"tags":223,"url":225,"year":213,"__hash__":226},"projects\u002Fprojects\u002F07.bushdocs.yml","BushDocs","Documentação técnica com categorias hierárquicas ilimitadas, editor rich text com imagens e vídeos, fluxo de rascunho e publicação e busca rápida com ⌘K.","\u002Fprojects\u002Fbushdocs.png",{},"projects\u002F07.bushdocs","Plataforma de documentação interna.",[75,87,224,90],"Tiptap","https:\u002F\u002Fbushdocs.vercel.app\u002F","88pcETkmoP3NFm07m8OTaAdbai37nd2-8TIY-i81Ryk",[228,231,234,237,240,243,246,249,262,274,286,299],{"id":128,"title":129,"accent":130,"description":131,"device":132,"extension":53,"featured":37,"image":133,"kind":134,"meta":229,"repo":136,"stem":137,"tagline":138,"tags":230,"url":142,"year":143,"__hash__":144},{},[75,87,90,140,141],{"id":146,"title":147,"accent":148,"description":149,"device":132,"extension":53,"featured":37,"image":150,"kind":151,"meta":232,"repo":136,"stem":153,"tagline":154,"tags":233,"url":158,"year":143,"__hash__":159},{},[156,81,157,90,105],{"id":161,"title":162,"accent":163,"description":164,"device":132,"extension":53,"featured":37,"image":165,"kind":151,"meta":235,"repo":136,"stem":167,"tagline":168,"tags":236,"url":170,"year":143,"__hash__":171},{},[75,102,87,81],{"id":173,"title":174,"accent":175,"description":176,"device":177,"extension":53,"featured":37,"image":178,"kind":151,"meta":238,"repo":136,"stem":180,"tagline":181,"tags":239,"url":185,"year":143,"__hash__":186},{},[99,81,183,184,105],{"id":188,"title":189,"accent":136,"description":190,"device":132,"extension":53,"featured":37,"image":191,"kind":192,"meta":241,"repo":136,"stem":194,"tagline":195,"tags":242,"url":198,"year":143,"__hash__":199},{},[75,87,90,197],{"id":201,"title":202,"accent":136,"description":203,"device":132,"extension":53,"featured":37,"image":204,"kind":205,"meta":244,"repo":136,"stem":207,"tagline":208,"tags":245,"url":212,"year":213,"__hash__":214},{},[75,210,81,211],{"id":216,"title":217,"accent":136,"description":218,"device":132,"extension":53,"featured":37,"image":219,"kind":192,"meta":247,"repo":136,"stem":221,"tagline":222,"tags":248,"url":225,"year":213,"__hash__":226},{},[75,87,224,90],{"id":250,"title":251,"accent":136,"description":252,"device":132,"extension":53,"featured":253,"image":254,"kind":151,"meta":255,"repo":136,"stem":256,"tagline":257,"tags":258,"url":260,"year":143,"__hash__":261},"projects\u002Fprojects\u002F08.pokerpg.yml","PokeRPG","Explore mapas procedurais pelo teclado, enfrente encontros aleatórios e capture, batalhe e troque Pokémon, com perfis, níveis e experiência. Dados da PokeAPI.",false,"\u002Fprojects\u002Fpokerpg.png",{},"projects\u002F08.pokerpg","RPG multiplayer de Pokémon no navegador.",[75,90,259,140],"PokeAPI","https:\u002F\u002Fpokerpg-chi.vercel.app\u002F","18Xeq0OHakXFKJ6CLbDXi7OHTcExH4qCrqfKCf5gKdM",{"id":263,"title":264,"accent":136,"description":265,"device":132,"extension":53,"featured":253,"image":266,"kind":192,"meta":267,"repo":136,"stem":268,"tagline":269,"tags":270,"url":272,"year":143,"__hash__":273},"projects\u002Fprojects\u002F09.booking-panels.yml","Booking Panels","Dois painéis mensais com linha do tempo de 36 dias e sete tipos de agendamento. Visualização pública, edição autenticada e atualização em tempo real via Supabase Realtime.","\u002Fprojects\u002Fbooking-panels.png",{},"projects\u002F09.booking-panels","Painéis de agendamento de produção em tempo real.",[75,87,271],"Supabase Realtime","https:\u002F\u002Fbooking-panels.vercel.app\u002F","y2iEjTOCE9uomrY_BvcUrEc1s68I2UbyMzuOt-d_jZw",{"id":275,"title":276,"accent":136,"description":277,"device":132,"extension":53,"featured":253,"image":278,"kind":192,"meta":279,"repo":136,"stem":280,"tagline":281,"tags":282,"url":284,"year":143,"__hash__":285},"projects\u002Fprojects\u002F10.accelerator.yml","Production Accelerator","Seis indicadores em gauges e um cronograma de 60 dias por baia, com modo TV que se atualiza sozinho e modo de edição com drag & drop de datas.","\u002Fprojects\u002Faccelerator.png",{},"projects\u002F10.accelerator","Dashboard de acompanhamento de produção.",[75,90,283],"Chart.js","https:\u002F\u002Faccelerator-gilt.vercel.app\u002F","cQB8X0ir3dZipl1HElNl0elYQuA6HvT13efem-d5NcY",{"id":287,"title":288,"accent":136,"description":289,"device":132,"extension":53,"featured":253,"image":290,"kind":151,"meta":291,"repo":292,"stem":293,"tagline":294,"tags":295,"url":297,"year":213,"__hash__":298},"projects\u002Fprojects\u002F11.kanboard.yml","KanBoard","Quadro Kanban com criação e remoção de colunas e cards, atalhos de teclado, undo\u002Fredo e persistência local. Projeto para explorar o Nuxt 4.","\u002Fkanboard.jpg",{},"https:\u002F\u002Fgithub.com\u002FFelipeO16\u002Fkanboard","projects\u002F11.kanboard","Kanban com atalhos de teclado e undo\u002Fredo.",[75,211,296],"VueUse","https:\u002F\u002Fkanboard.nuxt.dev\u002F","tsQYWkJzBU8Rj5hph3X0_oKcPXmnyLAIRh69QVA85-w",{"id":300,"title":301,"accent":136,"description":302,"device":132,"extension":53,"featured":253,"image":303,"kind":151,"meta":304,"repo":305,"stem":306,"tagline":307,"tags":308,"url":310,"year":311,"__hash__":312},"projects\u002Fprojects\u002F12.wordle.yml","Wordle Clone","Clone de Wordle feito para praticar Test-Driven Development com Vitest, com palavra do dia e feedback visual interativo.","\u002Fwordle.jpg",{},"https:\u002F\u002Fgithub.com\u002FFelipeO16\u002Fwordle","projects\u002F12.wordle","Wordle em Nuxt, construído com TDD.",[75,105,309,81],"TDD","https:\u002F\u002Fwordle.nuxt.dev\u002F",2024,"JLM-jGzPC_oxnzB5dVkdQisY6zTDDPjQZSKHQ9cHQFc",[314,1307,3308],{"id":315,"title":316,"body":317,"date":1288,"description":1289,"extension":1290,"image":1291,"meta":1292,"navigation":37,"path":1300,"seo":1301,"stem":1302,"tags":1303,"__hash__":1306},"blog\u002Fblog\u002Fnuxt-4-novidades-revolucionarias.md","Nuxt 4: As Novidades Revolucionárias que Você Precisa Conhecer",{"type":318,"value":319,"toc":1249},"minimark",[320,329,334,342,352,357,379,385,389,400,404,488,492,512,516,639,643,646,650,681,685,708,711,801,805,808,812,842,846,866,870,873,877,903,907,969,973,977,1003,1007,1013,1017,1039,1043,1063,1067,1078,1082,1106,1110,1113,1117,1155,1159,1178,1182,1187,1193,1197,1229,1232,1245],[321,322,323,324,328],"p",{},"O ",[325,326,327],"strong",{},"Nuxt 4"," chegou oficialmente em julho de 2025 e trouxe consigo uma evolução focada na experiência do desenvolvedor, com melhor organização de projetos, data fetching mais inteligente e suporte TypeScript aprimorado. Como desenvolvedor que acompanha de perto a evolução do framework, vou compartilhar as principais novidades que mais me impressionaram.",[330,331,333],"h2",{"id":332},"️-nova-estrutura-de-projeto-organização-inteligente","🗂️ Nova Estrutura de Projeto: Organização Inteligente",[321,335,336,337,341],{},"A maior mudança visível é como os projetos são organizados. Seu código de aplicação agora vive em um diretório ",[338,339,340],"code",{},"app\u002F"," por padrão:",[343,344,349],"pre",{"className":345,"code":347,"language":348},[346],"language-text","my-nuxt-app\u002F\n├─ app\u002F\n│  ├─ assets\u002F\n│  ├─ components\u002F\n│  ├─ composables\u002F\n│  ├─ layouts\u002F\n│  ├─ middleware\u002F\n│  ├─ pages\u002F\n│  ├─ plugins\u002F\n│  ├─ utils\u002F\n│  ├─ app.vue\n│  ├─ app.config.ts\n│  └─ error.vue\n├─ content\u002F\n├─ public\u002F\n├─ shared\u002F\n├─ server\u002F\n└─ nuxt.config.ts\n","text",[338,350,347],{"__ignoreMap":351},"",[353,354,356],"h3",{"id":355},"benefícios-da-nova-estrutura","Benefícios da Nova Estrutura",[358,359,360,367,373],"ul",{},[361,362,363,366],"li",{},[325,364,365],{},"File watchers mais rápidos"," (especialmente no Windows e Linux)",[361,368,369,372],{},[325,370,371],{},"Melhor contexto para IDEs"," sobre código cliente vs servidor",[361,374,375,378],{},[325,376,377],{},"Separação clara"," entre código da aplicação e dependências",[321,380,381,384],{},[325,382,383],{},"Não quer migrar?"," Não se preocupe! O Nuxt detecta sua estrutura existente e continua funcionando exatamente como antes.",[330,386,388],{"id":387},"data-fetching-mais-inteligente","🔄 Data Fetching Mais Inteligente",[321,390,391,392,395,396,399],{},"O Nuxt 4 trouxe melhorias significativas no ",[338,393,394],{},"useAsyncData"," e ",[338,397,398],{},"useFetch",":",[353,401,403],{"id":402},"compartilhamento-automático-de-dados","Compartilhamento Automático de Dados",[343,405,409],{"className":406,"code":407,"language":408,"meta":351,"style":351},"language-typescript shiki shiki-themes material-theme-lighter github-light github-dark","\u002F\u002F Múltiplos componentes usando a mesma chave agora compartilham dados automaticamente\nconst { data } = await useAsyncData('user-profile', () => $fetch('\u002Fapi\u002Fuser'))\n","typescript",[338,410,411,420],{"__ignoreMap":351},[412,413,416],"span",{"class":414,"line":415},"line",1,[412,417,419],{"class":418},"sutJx","\u002F\u002F Múltiplos componentes usando a mesma chave agora compartilham dados automaticamente\n",[412,421,423,427,431,435,438,442,446,450,454,458,462,464,467,470,473,476,478,480,483,485],{"class":414,"line":422},2,[412,424,426],{"class":425},"sbsja","const",[412,428,430],{"class":429},"sP7_E"," {",[412,432,434],{"class":433},"s_hVV"," data",[412,436,437],{"class":429}," }",[412,439,441],{"class":440},"smGrS"," =",[412,443,445],{"class":444},"sVHd0"," await",[412,447,449],{"class":448},"sGLFI"," useAsyncData",[412,451,453],{"class":452},"su5hD","(",[412,455,457],{"class":456},"sjJ54","'",[412,459,461],{"class":460},"s_sjI","user-profile",[412,463,457],{"class":456},[412,465,466],{"class":429},",",[412,468,469],{"class":429}," ()",[412,471,472],{"class":425}," =>",[412,474,475],{"class":448}," $fetch",[412,477,453],{"class":452},[412,479,457],{"class":456},[412,481,482],{"class":460},"\u002Fapi\u002Fuser",[412,484,457],{"class":456},[412,486,487],{"class":452},"))\n",[353,489,491],{"id":490},"limpeza-automática","Limpeza Automática",[358,493,494,500,506],{},[361,495,496,499],{},[325,497,498],{},"Cleanup automático"," quando componentes são desmontados",[361,501,502,505],{},[325,503,504],{},"Chaves reativas"," para refetch automático quando necessário",[361,507,508,511],{},[325,509,510],{},"Controle aprimorado"," sobre quando usar dados em cache",[353,513,515],{"id":514},"exemplo-prático","Exemplo Prático",[343,517,519],{"className":406,"code":518,"language":408,"meta":351,"style":351},"\u002F\u002F Chave reativa - refetch automático quando userId muda\nconst { data: user } = await useAsyncData('user', () => \n  $fetch(`\u002Fapi\u002Fusers\u002F${userId.value}`), \n  { key: `user-${userId.value}` }\n)\n",[338,520,521,526,566,602,633],{"__ignoreMap":351},[412,522,523],{"class":414,"line":415},[412,524,525],{"class":418},"\u002F\u002F Chave reativa - refetch automático quando userId muda\n",[412,527,528,530,532,535,537,540,542,544,546,548,550,552,555,557,559,561,563],{"class":414,"line":422},[412,529,426],{"class":425},[412,531,430],{"class":429},[412,533,434],{"class":534},"sucvu",[412,536,399],{"class":429},[412,538,539],{"class":433}," user",[412,541,437],{"class":429},[412,543,441],{"class":440},[412,545,445],{"class":444},[412,547,449],{"class":448},[412,549,453],{"class":452},[412,551,457],{"class":456},[412,553,554],{"class":460},"user",[412,556,457],{"class":456},[412,558,466],{"class":429},[412,560,469],{"class":429},[412,562,472],{"class":425},[412,564,565],{"class":452}," \n",[412,567,569,572,574,577,580,583,586,589,592,595,598,600],{"class":414,"line":568},3,[412,570,571],{"class":448},"  $fetch",[412,573,453],{"class":452},[412,575,576],{"class":456},"`",[412,578,579],{"class":460},"\u002Fapi\u002Fusers\u002F",[412,581,582],{"class":456},"${",[412,584,585],{"class":452},"userId",[412,587,588],{"class":456},".",[412,590,591],{"class":452},"value",[412,593,594],{"class":456},"}`",[412,596,597],{"class":452},")",[412,599,466],{"class":429},[412,601,565],{"class":452},[412,603,605,608,612,614,617,620,622,624,626,628,630],{"class":414,"line":604},4,[412,606,607],{"class":429},"  {",[412,609,611],{"class":610},"skxfh"," key",[412,613,399],{"class":429},[412,615,616],{"class":456}," `",[412,618,619],{"class":460},"user-",[412,621,582],{"class":456},[412,623,585],{"class":452},[412,625,588],{"class":456},[412,627,591],{"class":452},[412,629,594],{"class":456},[412,631,632],{"class":429}," }\n",[412,634,636],{"class":414,"line":635},5,[412,637,638],{"class":452},")\n",[330,640,642],{"id":641},"melhor-experiência-typescript","🔧 Melhor Experiência TypeScript",[321,644,645],{},"O Nuxt 4 cria projetos TypeScript separados para diferentes contextos:",[353,647,649],{"id":648},"separação-inteligente-de-contextos","Separação Inteligente de Contextos",[358,651,652,660,668,676],{},[361,653,654,657,658,597],{},[325,655,656],{},"Código da aplicação"," (",[338,659,340],{},[361,661,662,657,665,597],{},[325,663,664],{},"Código do servidor",[338,666,667],{},"server\u002F",[361,669,670,657,673,597],{},[325,671,672],{},"Código compartilhado",[338,674,675],{},"shared\u002F",[361,677,678],{},[325,679,680],{},"Código de configuração",[353,682,684],{"id":683},"benefícios-reais","Benefícios Reais",[358,686,687,693,699],{},[361,688,689,692],{},[325,690,691],{},"Autocompletar mais preciso"," e inferência de tipos",[361,694,695,698],{},[325,696,697],{},"Menos erros confusos"," ao trabalhar em diferentes contextos",[361,700,701,707],{},[325,702,703,704],{},"Apenas um ",[338,705,706],{},"tsconfig.json"," na raiz do projeto",[353,709,515],{"id":710},"exemplo-prático-1",[343,712,714],{"className":406,"code":713,"language":408,"meta":351,"style":351},"\u002F\u002F app\u002Fcomposables\u002FuseAuth.ts - Tipagem automática\nexport const useAuth = () => {\n  const user = ref\u003CUser | null>(null)\n  \u002F\u002F TypeScript entende automaticamente o tipo User\n  return { user }\n}\n",[338,715,716,721,742,779,784,795],{"__ignoreMap":351},[412,717,718],{"class":414,"line":415},[412,719,720],{"class":418},"\u002F\u002F app\u002Fcomposables\u002FuseAuth.ts - Tipagem automática\n",[412,722,723,726,729,733,735,737,739],{"class":414,"line":422},[412,724,725],{"class":444},"export",[412,727,728],{"class":425}," const",[412,730,732],{"class":731},"sfCm-"," useAuth",[412,734,441],{"class":440},[412,736,469],{"class":429},[412,738,472],{"class":425},[412,740,741],{"class":429}," {\n",[412,743,744,747,749,751,754,757,761,764,768,771,773,777],{"class":414,"line":568},[412,745,746],{"class":425},"  const",[412,748,539],{"class":433},[412,750,441],{"class":440},[412,752,753],{"class":448}," ref",[412,755,756],{"class":429},"\u003C",[412,758,760],{"class":759},"sbgvK","User",[412,762,763],{"class":440}," |",[412,765,767],{"class":766},"sZMiF"," null",[412,769,770],{"class":429},">",[412,772,453],{"class":610},[412,774,776],{"class":775},"s39Yj","null",[412,778,638],{"class":610},[412,780,781],{"class":414,"line":604},[412,782,783],{"class":418},"  \u002F\u002F TypeScript entende automaticamente o tipo User\n",[412,785,786,789,791,793],{"class":414,"line":635},[412,787,788],{"class":444},"  return",[412,790,430],{"class":429},[412,792,539],{"class":452},[412,794,632],{"class":429},[412,796,798],{"class":414,"line":797},6,[412,799,800],{"class":429},"}\n",[330,802,804],{"id":803},"cli-e-desenvolvimento-mais-rápido","⚡ CLI e Desenvolvimento Mais Rápido",[321,806,807],{},"O Nuxt 4 trouxe melhorias significativas na velocidade:",[353,809,811],{"id":810},"melhorias-de-performance","Melhorias de Performance",[358,813,814,820,826,836],{},[361,815,816,819],{},[325,817,818],{},"Cold starts mais rápidos"," - inicialização do servidor de desenvolvimento",[361,821,822,825],{},[325,823,824],{},"Node.js compile cache"," - reutilização automática do cache v8",[361,827,828,831,832,835],{},[325,829,830],{},"File watching nativo"," - usa APIs ",[338,833,834],{},"fs.watch"," para menos recursos do sistema",[361,837,838,841],{},[325,839,840],{},"Comunicação via sockets"," - CLI e Vite se comunicam via sockets internos",[353,843,845],{"id":844},"impacto-real","Impacto Real",[358,847,848,854,860],{},[361,849,850,853],{},[325,851,852],{},"Startup 40% mais rápido"," em desenvolvimento",[361,855,856,859],{},[325,857,858],{},"Menos uso de memória"," e recursos do sistema",[361,861,862,865],{},[325,863,864],{},"Especialmente notável no Windows"," devido às otimizações de socket",[330,867,869],{"id":868},"templates-atualizados","🎨 Templates Atualizados",[321,871,872],{},"Os templates de inicialização do Nuxt receberam uma renovação completa:",[353,874,876],{"id":875},"melhorias-nos-templates","Melhorias nos Templates",[358,878,879,885,891,897],{},[361,880,881,884],{},[325,882,883],{},"Acessibilidade aprimorada"," por padrão",[361,886,887,890],{},[325,888,889],{},"Títulos padrão"," mais informativos",[361,892,893,896],{},[325,894,895],{},"Polimento visual"," geral dos templates",[361,898,899,902],{},[325,900,901],{},"Melhor estrutura"," de componentes",[353,904,906],{"id":905},"template-padrão-renovado","Template Padrão Renovado",[343,908,912],{"className":909,"code":910,"language":911,"meta":351,"style":351},"language-vue shiki shiki-themes material-theme-lighter github-light github-dark","\u003C!-- app.vue - Template mais limpo e organizado -->\n\u003Ctemplate>\n  \u003Cdiv>\n    \u003CNuxtWelcome \u002F>\n  \u003C\u002Fdiv>\n\u003C\u002Ftemplate>\n","vue",[338,913,914,919,930,940,951,960],{"__ignoreMap":351},[412,915,916],{"class":414,"line":415},[412,917,918],{"class":418},"\u003C!-- app.vue - Template mais limpo e organizado -->\n",[412,920,921,923,927],{"class":414,"line":422},[412,922,756],{"class":429},[412,924,926],{"class":925},"sQzsp","template",[412,928,929],{"class":429},">\n",[412,931,932,935,938],{"class":414,"line":568},[412,933,934],{"class":429},"  \u003C",[412,936,937],{"class":925},"div",[412,939,929],{"class":429},[412,941,942,945,948],{"class":414,"line":604},[412,943,944],{"class":429},"    \u003C",[412,946,947],{"class":925},"NuxtWelcome",[412,949,950],{"class":429}," \u002F>\n",[412,952,953,956,958],{"class":414,"line":635},[412,954,955],{"class":429},"  \u003C\u002F",[412,957,937],{"class":925},[412,959,929],{"class":429},[412,961,962,965,967],{"class":414,"line":797},[412,963,964],{"class":429},"\u003C\u002F",[412,966,926],{"class":925},[412,968,929],{"class":429},[330,970,972],{"id":971},"impacto-real-nos-projetos","📈 Impacto Real nos Projetos",[353,974,976],{"id":975},"melhorias-observadas","Melhorias Observadas",[358,978,979,985,991,997],{},[361,980,981,984],{},[325,982,983],{},"Desenvolvimento mais fluido"," com file watchers otimizados",[361,986,987,990],{},[325,988,989],{},"TypeScript mais preciso"," com separação de contextos",[361,992,993,996],{},[325,994,995],{},"Data fetching mais eficiente"," com compartilhamento automático",[361,998,999,1002],{},[325,1000,1001],{},"CLI mais responsivo"," especialmente no Windows",[330,1004,1006],{"id":1005},"como-fazer-a-migração","🚀 Como Fazer a Migração",[321,1008,1009,1010,399],{},"A migração é ",[325,1011,1012],{},"surpreendentemente simples",[353,1014,1016],{"id":1015},"_1-atualizar-o-nuxt","1. Atualizar o Nuxt",[343,1018,1022],{"className":1019,"code":1020,"language":1021,"meta":351,"style":351},"language-bash shiki shiki-themes material-theme-lighter github-light github-dark","npx nuxt upgrade --dedupe\n","bash",[338,1023,1024],{"__ignoreMap":351},[412,1025,1026,1029,1032,1035],{"class":414,"line":415},[412,1027,1028],{"class":759},"npx",[412,1030,1031],{"class":460}," nuxt",[412,1033,1034],{"class":460}," upgrade",[412,1036,1038],{"class":1037},"stzsN"," --dedupe\n",[353,1040,1042],{"id":1041},"_2-usar-ferramentas-de-migração-opcional","2. Usar Ferramentas de Migração (Opcional)",[343,1044,1046],{"className":1019,"code":1045,"language":1021,"meta":351,"style":351},"# Automatiza muitos passos da migração\nnpx codemod@latest nuxt\u002F4\u002Fmigration-recipe\n",[338,1047,1048,1053],{"__ignoreMap":351},[412,1049,1050],{"class":414,"line":415},[412,1051,1052],{"class":418},"# Automatiza muitos passos da migração\n",[412,1054,1055,1057,1060],{"class":414,"line":422},[412,1056,1028],{"class":759},[412,1058,1059],{"class":460}," codemod@latest",[412,1061,1062],{"class":460}," nuxt\u002F4\u002Fmigration-recipe\n",[353,1064,1066],{"id":1065},"_3-testar-e-ajustar","3. Testar e Ajustar",[358,1068,1069,1072,1075],{},[361,1070,1071],{},"Execute seus testes",[361,1073,1074],{},"Verifique se tudo compila corretamente",[361,1076,1077],{},"Ajuste qualquer problema que surgir",[353,1079,1081],{"id":1080},"compatibilidade","Compatibilidade",[358,1083,1084,1094,1100],{},[361,1085,1086,1089,1090,1093],{},[325,1087,1088],{},"Nuxt 2 compatibility removida"," do ",[338,1091,1092],{},"@nuxt\u002Fkit"," (afeta principalmente autores de módulos)",[361,1095,1096,1099],{},[325,1097,1098],{},"Utilitários legados"," e funcionalidades depreciadas foram limpos",[361,1101,1102,1105],{},[325,1103,1104],{},"Configurações de compatibilidade"," disponíveis para reverter comportamento antigo",[330,1107,1109],{"id":1108},"o-futuro-do-nuxt","🔮 O Futuro do Nuxt",[321,1111,1112],{},"O Nuxt 4 estabelece as bases para:",[353,1114,1116],{"id":1115},"próximas-versões","Próximas Versões",[358,1118,1119,1125,1131,1137,1143,1149],{},[361,1120,1121,1124],{},[325,1122,1123],{},"Nuxt 5"," planejado para o futuro próximo com Nitro v3 e h3 v2",[361,1126,1127,1130],{},[325,1128,1129],{},"Melhor performance"," com Vite Environment API",[361,1132,1133,1136],{},[325,1134,1135],{},"SSR streaming"," (#4753)",[361,1138,1139,1142],{},[325,1140,1141],{},"Módulo de acessibilidade"," oficial (#23255)",[361,1144,1145,1148],{},[325,1146,1147],{},"Estratégias de cache"," para fetch (#26017)",[361,1150,1151,1154],{},[325,1152,1153],{},"Suporte multi-app"," (#21635)",[353,1156,1158],{"id":1157},"roadmap","Roadmap",[358,1160,1161,1167,1172],{},[361,1162,1163,1166],{},[325,1164,1165],{},"Nuxt 3"," continuará recebendo atualizações até janeiro de 2026",[361,1168,1169,1171],{},[325,1170,327],{}," receberá patches rápidos para correções",[361,1173,1174,1177],{},[325,1175,1176],{},"Funcionalidades"," continuarão sendo lançadas em versões menores",[330,1179,1181],{"id":1180},"conclusão","🎉 Conclusão",[321,1183,323,1184,1186],{},[325,1185,327],{}," representa uma evolução focada na experiência do desenvolvedor, com melhor organização de projetos, data fetching mais inteligente e suporte TypeScript aprimorado. As melhorias são pensadas para tornar o desenvolvimento mais fluido e eficiente.",[321,1188,1189,1192],{},[325,1190,1191],{},"Minha recomendação",": A migração é simples e os benefícios são imediatos. O Nuxt 4 é a escolha natural para novos projetos Vue.js em 2025.",[353,1194,1196],{"id":1195},"principais-benefícios","Principais Benefícios",[358,1198,1199,1208,1213,1218,1223],{},[361,1200,1201,1202,1205,1206],{},"✅ ",[325,1203,1204],{},"Organização melhor"," com estrutura ",[338,1207,340],{},[361,1209,1201,1210,996],{},[325,1211,1212],{},"Data fetching inteligente",[361,1214,1201,1215,990],{},[325,1216,1217],{},"TypeScript aprimorado",[361,1219,1201,1220,1002],{},[325,1221,1222],{},"CLI mais rápido",[361,1224,1201,1225,1228],{},[325,1226,1227],{},"Migração simples"," com ferramentas automatizadas",[1230,1231],"hr",{},[321,1233,1234],{},[1235,1236,1237,1238,1244],"em",{},"Quer saber mais sobre alguma funcionalidade específica? Deixe um comentário ou me siga no ",[1239,1240,24],"a",{"href":1241,"rel":1242},"https:\u002F\u002Fgithub.com\u002FFelipeOl6",[1243],"nofollow"," para mais insights sobre Nuxt.js!",[1246,1247,1248],"style",{},"html pre.shiki code .sutJx, html code.shiki .sutJx{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#6A737D;--shiki-default-font-style:inherit;--shiki-dark:#6A737D;--shiki-dark-font-style:inherit}html pre.shiki code .sbsja, html code.shiki .sbsja{--shiki-light:#9C3EDA;--shiki-default:#D73A49;--shiki-dark:#F97583}html pre.shiki code .sP7_E, html code.shiki .sP7_E{--shiki-light:#39ADB5;--shiki-default:#24292E;--shiki-dark:#E1E4E8}html pre.shiki code .s_hVV, html code.shiki .s_hVV{--shiki-light:#90A4AE;--shiki-default:#005CC5;--shiki-dark:#79B8FF}html pre.shiki code .smGrS, html code.shiki .smGrS{--shiki-light:#39ADB5;--shiki-default:#D73A49;--shiki-dark:#F97583}html pre.shiki code .sVHd0, html code.shiki .sVHd0{--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#D73A49;--shiki-default-font-style:inherit;--shiki-dark:#F97583;--shiki-dark-font-style:inherit}html pre.shiki code .sGLFI, html code.shiki .sGLFI{--shiki-light:#6182B8;--shiki-default:#6F42C1;--shiki-dark:#B392F0}html pre.shiki code .su5hD, html code.shiki .su5hD{--shiki-light:#90A4AE;--shiki-default:#24292E;--shiki-dark:#E1E4E8}html pre.shiki code .sjJ54, html code.shiki .sjJ54{--shiki-light:#39ADB5;--shiki-default:#032F62;--shiki-dark:#9ECBFF}html pre.shiki code .s_sjI, html code.shiki .s_sjI{--shiki-light:#91B859;--shiki-default:#032F62;--shiki-dark:#9ECBFF}html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html pre.shiki code .sucvu, html code.shiki .sucvu{--shiki-light:#E53935;--shiki-default:#E36209;--shiki-dark:#FFAB70}html pre.shiki code .skxfh, html code.shiki .skxfh{--shiki-light:#E53935;--shiki-default:#24292E;--shiki-dark:#E1E4E8}html pre.shiki code .sfCm-, html code.shiki .sfCm-{--shiki-light:#90A4AE;--shiki-default:#6F42C1;--shiki-dark:#B392F0}html pre.shiki code .sbgvK, html code.shiki .sbgvK{--shiki-light:#E2931D;--shiki-default:#6F42C1;--shiki-dark:#B392F0}html pre.shiki code .sZMiF, html code.shiki .sZMiF{--shiki-light:#E2931D;--shiki-default:#005CC5;--shiki-dark:#79B8FF}html pre.shiki code .s39Yj, html code.shiki .s39Yj{--shiki-light:#39ADB5;--shiki-default:#005CC5;--shiki-dark:#79B8FF}html pre.shiki code .sQzsp, html code.shiki .sQzsp{--shiki-light:#E53935;--shiki-default:#22863A;--shiki-dark:#85E89D}html pre.shiki code .stzsN, html code.shiki .stzsN{--shiki-light:#91B859;--shiki-default:#005CC5;--shiki-dark:#79B8FF}",{"title":351,"searchDepth":422,"depth":422,"links":1250},[1251,1254,1259,1264,1268,1272,1275,1281,1285],{"id":332,"depth":422,"text":333,"children":1252},[1253],{"id":355,"depth":568,"text":356},{"id":387,"depth":422,"text":388,"children":1255},[1256,1257,1258],{"id":402,"depth":568,"text":403},{"id":490,"depth":568,"text":491},{"id":514,"depth":568,"text":515},{"id":641,"depth":422,"text":642,"children":1260},[1261,1262,1263],{"id":648,"depth":568,"text":649},{"id":683,"depth":568,"text":684},{"id":710,"depth":568,"text":515},{"id":803,"depth":422,"text":804,"children":1265},[1266,1267],{"id":810,"depth":568,"text":811},{"id":844,"depth":568,"text":845},{"id":868,"depth":422,"text":869,"children":1269},[1270,1271],{"id":875,"depth":568,"text":876},{"id":905,"depth":568,"text":906},{"id":971,"depth":422,"text":972,"children":1273},[1274],{"id":975,"depth":568,"text":976},{"id":1005,"depth":422,"text":1006,"children":1276},[1277,1278,1279,1280],{"id":1015,"depth":568,"text":1016},{"id":1041,"depth":568,"text":1042},{"id":1065,"depth":568,"text":1066},{"id":1080,"depth":568,"text":1081},{"id":1108,"depth":422,"text":1109,"children":1282},[1283,1284],{"id":1115,"depth":568,"text":1116},{"id":1157,"depth":568,"text":1158},{"id":1180,"depth":422,"text":1181,"children":1286},[1287],{"id":1195,"depth":568,"text":1196},"2025-01-15","Descubra as principais novidades do Nuxt 4, incluindo nova estrutura de projeto, data fetching inteligente, melhor suporte TypeScript e CLI mais rápido.","md","https:\u002F\u002Fvueschool.io\u002F_ipx\u002Ff_webp&q_100&s_1200x1200\u002Fhttps:\u002F\u002Fvueschool.io\u002Fstorage\u002Fmedia\u002F02c8784f683de4262d21016a4ae714b8\u002FThe-Complete-Guide-to-Data-Fetching-in-Nuxt-01.png",{"author":1293},{"name":1294,"avatar":1295,"bio":1297,"social":1298},"Felipe Oliveira",{"src":1296},"https:\u002F\u002Fi.imgur.com\u002FywWj688.jpeg","Desenvolvedor Front-end especialista em Vue.js, Nuxt.js e TypeScript. Criador da Paper UI e apaixonado por design systems inovadores.",{"github":1241,"linkedin":1299},"https:\u002F\u002Flinkedin.com\u002Fin\u002Ffelipe-oliveira-dev","\u002Fblog\u002Fnuxt-4-novidades-revolucionarias",{"title":316,"description":1289},"blog\u002Fnuxt-4-novidades-revolucionarias",[1304,911,408,1305],"nuxt","performance","Kran5QPG72bh6emMR0je4p5DD4PKzxj_yQcqWQhPnAI",{"id":1308,"title":1309,"body":1310,"date":3293,"description":3294,"extension":1290,"image":3295,"meta":3296,"navigation":37,"path":3300,"seo":3301,"stem":3302,"tags":3303,"__hash__":3307},"blog\u002Fblog\u002Fpaper-ui-historia-criacao.md","Paper UI: A História por Trás da Biblioteca que Revolucionou o Design Vue.js",{"type":318,"value":1311,"toc":3243},[1312,1325,1329,1333,1336,1358,1368,1372,1375,1383,1387,1391,1398,1424,1428,1621,1627,1631,1635,1638,1843,1847,2005,2009,2163,2167,2171,2230,2234,2335,2339,2391,2395,2399,2425,2427,2497,2501,2505,2576,2580,2726,2730,2783,2787,2791,2794,2801,2805,2811,2815,2883,2887,2891,2898,2902,2909,2913,2920,2924,2928,2954,2958,3030,3034,3038,3045,3049,3107,3111,3143,3147,3169,3171,3180,3202,3208,3218,3220,3231,3240],[321,1313,1314,1315,1317,1318,1321,1322],{},"A ",[325,1316,202],{}," não nasceu de um planejamento estratégico ou de uma necessidade de mercado. Ela nasceu de uma ",[325,1319,1320],{},"frustração pessoal"," e de uma pergunta simples: ",[1235,1323,1324],{},"\"Por que todas as interfaces web parecem iguais?\"",[330,1326,1328],{"id":1327},"o-problema-que-me-incomodava","🎨 O Problema que Me Incomodava",[353,1330,1332],{"id":1331},"a-era-do-design-minimalista","A Era do Design Minimalista",[321,1334,1335],{},"Em 2023, o design web estava dominado pelo minimalismo:",[358,1337,1338,1343,1348,1353],{},[361,1339,1340],{},[325,1341,1342],{},"Bordas perfeitamente retas",[361,1344,1345],{},[325,1346,1347],{},"Cores monocromáticas",[361,1349,1350],{},[325,1351,1352],{},"Tipografia sem personalidade",[361,1354,1355],{},[325,1356,1357],{},"Interações previsíveis",[321,1359,1360,1361,1364,1365,588],{},"Tudo parecia saído da mesma fábrica de interfaces. Como desenvolvedor, sentia que estava criando produtos ",[325,1362,1363],{},"tecnicamente perfeitos",", mas ",[325,1366,1367],{},"emocionalmente vazios",[353,1369,1371],{"id":1370},"a-pergunta-que-mudou-tudo","A Pergunta que Mudou Tudo",[321,1373,1374],{},"Durante uma sessão de brainstorming para um projeto de e-commerce, me perguntei:",[1376,1377,1378],"blockquote",{},[321,1379,1380],{},[1235,1381,1382],{},"\"E se as interfaces web tivessem a mesma personalidade e calor humano que um desenho feito à mão?\"",[330,1384,1386],{"id":1385},"o-momento-eureka","💡 O Momento Eureka",[353,1388,1390],{"id":1389},"inspiração-inesperada","Inspiração Inesperada",[321,1392,1393,1394,1397],{},"A ideia veio de uma fonte inesperada: ",[325,1395,1396],{},"meu sobrinho de 5 anos"," desenhando com lápis de cor. Observando ele criar, percebi que:",[358,1399,1400,1406,1412,1418],{},[361,1401,1402,1405],{},[325,1403,1404],{},"Linhas imperfeitas"," transmitem mais personalidade",[361,1407,1408,1411],{},[325,1409,1410],{},"Cores vibrantes"," criam mais conexão emocional",[361,1413,1414,1417],{},[325,1415,1416],{},"Formas orgânicas"," são mais acolhedoras",[361,1419,1420,1423],{},[325,1421,1422],{},"Texturas visuais"," adicionam profundidade",[353,1425,1427],{"id":1426},"o-primeiro-protótipo","O Primeiro Protótipo",[343,1429,1431],{"className":909,"code":1430,"language":911,"meta":351,"style":351},"\u003C!-- Meu primeiro componente \"hand-drawn\" -->\n\u003Ctemplate>\n  \u003Cdiv class=\"paper-button\">\n    \u003Csvg class=\"paper-border\" viewBox=\"0 0 100 40\">\n      \u003Cpath d=\"M5,5 Q5,2 8,2 L92,2 Q95,2 95,5 L95,35 Q95,38 92,38 L8,38 Q5,38 5,35 Z\" \n            fill=\"none\" stroke=\"#333\" stroke-width=\"2\"\u002F>\n    \u003C\u002Fsvg>\n    \u003Cspan class=\"paper-text\">{{ label }}\u003C\u002Fspan>\n  \u003C\u002Fdiv>\n\u003C\u002Ftemplate>\n",[338,1432,1433,1438,1446,1469,1501,1523,1564,1574,1603,1612],{"__ignoreMap":351},[412,1434,1435],{"class":414,"line":415},[412,1436,1437],{"class":418},"\u003C!-- Meu primeiro componente \"hand-drawn\" -->\n",[412,1439,1440,1442,1444],{"class":414,"line":422},[412,1441,756],{"class":429},[412,1443,926],{"class":925},[412,1445,929],{"class":429},[412,1447,1448,1450,1452,1456,1459,1462,1465,1467],{"class":414,"line":568},[412,1449,934],{"class":429},[412,1451,937],{"class":925},[412,1453,1455],{"class":1454},"s9AJx"," class",[412,1457,1458],{"class":429},"=",[412,1460,1461],{"class":456},"\"",[412,1463,1464],{"class":460},"paper-button",[412,1466,1461],{"class":456},[412,1468,929],{"class":429},[412,1470,1471,1473,1476,1478,1480,1482,1485,1487,1490,1492,1494,1497,1499],{"class":414,"line":604},[412,1472,944],{"class":429},[412,1474,1475],{"class":925},"svg",[412,1477,1455],{"class":1454},[412,1479,1458],{"class":429},[412,1481,1461],{"class":456},[412,1483,1484],{"class":460},"paper-border",[412,1486,1461],{"class":456},[412,1488,1489],{"class":1454}," viewBox",[412,1491,1458],{"class":429},[412,1493,1461],{"class":456},[412,1495,1496],{"class":460},"0 0 100 40",[412,1498,1461],{"class":456},[412,1500,929],{"class":429},[412,1502,1503,1506,1509,1512,1514,1516,1519,1521],{"class":414,"line":635},[412,1504,1505],{"class":429},"      \u003C",[412,1507,1508],{"class":925},"path",[412,1510,1511],{"class":1454}," d",[412,1513,1458],{"class":429},[412,1515,1461],{"class":456},[412,1517,1518],{"class":460},"M5,5 Q5,2 8,2 L92,2 Q95,2 95,5 L95,35 Q95,38 92,38 L8,38 Q5,38 5,35 Z",[412,1520,1461],{"class":456},[412,1522,565],{"class":429},[412,1524,1525,1528,1530,1532,1535,1537,1540,1542,1544,1547,1549,1552,1554,1556,1559,1561],{"class":414,"line":797},[412,1526,1527],{"class":1454},"            fill",[412,1529,1458],{"class":429},[412,1531,1461],{"class":456},[412,1533,1534],{"class":460},"none",[412,1536,1461],{"class":456},[412,1538,1539],{"class":1454}," stroke",[412,1541,1458],{"class":429},[412,1543,1461],{"class":456},[412,1545,1546],{"class":460},"#333",[412,1548,1461],{"class":456},[412,1550,1551],{"class":1454}," stroke-width",[412,1553,1458],{"class":429},[412,1555,1461],{"class":456},[412,1557,1558],{"class":460},"2",[412,1560,1461],{"class":456},[412,1562,1563],{"class":429},"\u002F>\n",[412,1565,1567,1570,1572],{"class":414,"line":1566},7,[412,1568,1569],{"class":429},"    \u003C\u002F",[412,1571,1475],{"class":925},[412,1573,929],{"class":429},[412,1575,1577,1579,1581,1583,1585,1587,1590,1592,1594,1597,1599,1601],{"class":414,"line":1576},8,[412,1578,944],{"class":429},[412,1580,412],{"class":925},[412,1582,1455],{"class":1454},[412,1584,1458],{"class":429},[412,1586,1461],{"class":456},[412,1588,1589],{"class":460},"paper-text",[412,1591,1461],{"class":456},[412,1593,770],{"class":429},[412,1595,1596],{"class":452},"{{ label }}",[412,1598,964],{"class":429},[412,1600,412],{"class":925},[412,1602,929],{"class":429},[412,1604,1606,1608,1610],{"class":414,"line":1605},9,[412,1607,955],{"class":429},[412,1609,937],{"class":925},[412,1611,929],{"class":429},[412,1613,1615,1617,1619],{"class":414,"line":1614},10,[412,1616,964],{"class":429},[412,1618,926],{"class":925},[412,1620,929],{"class":429},[321,1622,1623,1626],{},[325,1624,1625],{},"Resultado",": Um botão que parecia desenhado à mão, com bordas orgânicas e textura visual.",[330,1628,1630],{"id":1629},"️-os-desafios-técnicos","🛠️ Os Desafios Técnicos",[353,1632,1634],{"id":1633},"_1-criando-bordas-orgânicas","1. Criando Bordas Orgânicas",[321,1636,1637],{},"O maior desafio foi criar bordas que parecessem desenhadas à mão:",[343,1639,1643],{"className":1640,"code":1641,"language":1642,"meta":351,"style":351},"language-css shiki shiki-themes material-theme-lighter github-light github-dark",".paper-border {\n  filter: drop-shadow(1px 1px 0px rgba(0,0,0,0.1));\n  animation: paper-shake 0.1s ease-in-out infinite alternate;\n}\n\n@keyframes paper-shake {\n  0% { transform: translate(0, 0) rotate(0deg); }\n  100% { transform: translate(0.5px, 0.5px) rotate(0.2deg); }\n}\n","css",[338,1644,1645,1654,1710,1737,1741,1746,1757,1797,1839],{"__ignoreMap":351},[412,1646,1647,1650,1652],{"class":414,"line":415},[412,1648,588],{"class":1649},"stp6e",[412,1651,1484],{"class":759},[412,1653,741],{"class":429},[412,1655,1656,1660,1662,1666,1668,1672,1676,1679,1681,1684,1686,1689,1691,1694,1696,1698,1700,1702,1704,1707],{"class":414,"line":422},[412,1657,1659],{"class":1658},"soE4H","  filter",[412,1661,399],{"class":429},[412,1663,1665],{"class":1664},"sptTA"," drop-shadow",[412,1667,453],{"class":429},[412,1669,1671],{"class":1670},"srdBf","1",[412,1673,1675],{"class":1674},"sw1J6","px",[412,1677,1678],{"class":1670}," 1",[412,1680,1675],{"class":1674},[412,1682,1683],{"class":1670}," 0",[412,1685,1675],{"class":1674},[412,1687,1688],{"class":1664}," rgba",[412,1690,453],{"class":429},[412,1692,1693],{"class":1670},"0",[412,1695,466],{"class":429},[412,1697,1693],{"class":1670},[412,1699,466],{"class":429},[412,1701,1693],{"class":1670},[412,1703,466],{"class":429},[412,1705,1706],{"class":1670},"0.1",[412,1708,1709],{"class":429},"));\n",[412,1711,1712,1715,1717,1720,1722,1725,1728,1731,1734],{"class":414,"line":568},[412,1713,1714],{"class":1658},"  animation",[412,1716,399],{"class":429},[412,1718,1719],{"class":452}," paper-shake ",[412,1721,1706],{"class":1670},[412,1723,1724],{"class":1674},"s",[412,1726,1727],{"class":433}," ease-in-out",[412,1729,1730],{"class":433}," infinite",[412,1732,1733],{"class":433}," alternate",[412,1735,1736],{"class":429},";\n",[412,1738,1739],{"class":414,"line":604},[412,1740,800],{"class":429},[412,1742,1743],{"class":414,"line":635},[412,1744,1745],{"emptyLinePlaceholder":37},"\n",[412,1747,1748,1751,1755],{"class":414,"line":797},[412,1749,1750],{"class":444},"@keyframes",[412,1752,1754],{"class":1753},"s99_P"," paper-shake",[412,1756,741],{"class":429},[412,1758,1759,1762,1764,1767,1769,1772,1774,1776,1778,1780,1782,1785,1787,1789,1792,1795],{"class":414,"line":1566},[412,1760,1761],{"class":759},"  0%",[412,1763,430],{"class":429},[412,1765,1766],{"class":1658}," transform",[412,1768,399],{"class":429},[412,1770,1771],{"class":1664}," translate",[412,1773,453],{"class":429},[412,1775,1693],{"class":1670},[412,1777,466],{"class":429},[412,1779,1683],{"class":1670},[412,1781,597],{"class":429},[412,1783,1784],{"class":1664}," rotate",[412,1786,453],{"class":429},[412,1788,1693],{"class":1670},[412,1790,1791],{"class":1674},"deg",[412,1793,1794],{"class":429},");",[412,1796,632],{"class":429},[412,1798,1799,1802,1804,1806,1808,1810,1812,1815,1817,1819,1822,1824,1826,1828,1830,1833,1835,1837],{"class":414,"line":1576},[412,1800,1801],{"class":759},"  100%",[412,1803,430],{"class":429},[412,1805,1766],{"class":1658},[412,1807,399],{"class":429},[412,1809,1771],{"class":1664},[412,1811,453],{"class":429},[412,1813,1814],{"class":1670},"0.5",[412,1816,1675],{"class":1674},[412,1818,466],{"class":429},[412,1820,1821],{"class":1670}," 0.5",[412,1823,1675],{"class":1674},[412,1825,597],{"class":429},[412,1827,1784],{"class":1664},[412,1829,453],{"class":429},[412,1831,1832],{"class":1670},"0.2",[412,1834,1791],{"class":1674},[412,1836,1794],{"class":429},[412,1838,632],{"class":429},[412,1840,1841],{"class":414,"line":1605},[412,1842,800],{"class":429},[353,1844,1846],{"id":1845},"_2-sistema-de-cores-inteligente","2. Sistema de Cores Inteligente",[343,1848,1850],{"className":406,"code":1849,"language":408,"meta":351,"style":351},"\u002F\u002F Sistema de cores que simula materiais reais\nconst paperColors = {\n  'paper-white': {\n    base: '#fefefe',\n    shadow: '#f0f0f0',\n    highlight: '#ffffff'\n  },\n  'paper-yellow': {\n    base: '#fff8dc',\n    shadow: '#f0e68c',\n    highlight: '#ffffe0'\n  }\n}\n",[338,1851,1852,1857,1868,1883,1901,1917,1932,1937,1950,1965,1980,1994,2000],{"__ignoreMap":351},[412,1853,1854],{"class":414,"line":415},[412,1855,1856],{"class":418},"\u002F\u002F Sistema de cores que simula materiais reais\n",[412,1858,1859,1861,1864,1866],{"class":414,"line":422},[412,1860,426],{"class":425},[412,1862,1863],{"class":433}," paperColors",[412,1865,441],{"class":440},[412,1867,741],{"class":429},[412,1869,1870,1873,1877,1879,1881],{"class":414,"line":568},[412,1871,1872],{"class":456},"  '",[412,1874,1876],{"class":1875},"sZUrc","paper-white",[412,1878,457],{"class":456},[412,1880,399],{"class":429},[412,1882,741],{"class":429},[412,1884,1885,1888,1890,1893,1896,1898],{"class":414,"line":604},[412,1886,1887],{"class":610},"    base",[412,1889,399],{"class":429},[412,1891,1892],{"class":456}," '",[412,1894,1895],{"class":460},"#fefefe",[412,1897,457],{"class":456},[412,1899,1900],{"class":429},",\n",[412,1902,1903,1906,1908,1910,1913,1915],{"class":414,"line":635},[412,1904,1905],{"class":610},"    shadow",[412,1907,399],{"class":429},[412,1909,1892],{"class":456},[412,1911,1912],{"class":460},"#f0f0f0",[412,1914,457],{"class":456},[412,1916,1900],{"class":429},[412,1918,1919,1922,1924,1926,1929],{"class":414,"line":797},[412,1920,1921],{"class":610},"    highlight",[412,1923,399],{"class":429},[412,1925,1892],{"class":456},[412,1927,1928],{"class":460},"#ffffff",[412,1930,1931],{"class":456},"'\n",[412,1933,1934],{"class":414,"line":1566},[412,1935,1936],{"class":429},"  },\n",[412,1938,1939,1941,1944,1946,1948],{"class":414,"line":1576},[412,1940,1872],{"class":456},[412,1942,1943],{"class":1875},"paper-yellow",[412,1945,457],{"class":456},[412,1947,399],{"class":429},[412,1949,741],{"class":429},[412,1951,1952,1954,1956,1958,1961,1963],{"class":414,"line":1605},[412,1953,1887],{"class":610},[412,1955,399],{"class":429},[412,1957,1892],{"class":456},[412,1959,1960],{"class":460},"#fff8dc",[412,1962,457],{"class":456},[412,1964,1900],{"class":429},[412,1966,1967,1969,1971,1973,1976,1978],{"class":414,"line":1614},[412,1968,1905],{"class":610},[412,1970,399],{"class":429},[412,1972,1892],{"class":456},[412,1974,1975],{"class":460},"#f0e68c",[412,1977,457],{"class":456},[412,1979,1900],{"class":429},[412,1981,1983,1985,1987,1989,1992],{"class":414,"line":1982},11,[412,1984,1921],{"class":610},[412,1986,399],{"class":429},[412,1988,1892],{"class":456},[412,1990,1991],{"class":460},"#ffffe0",[412,1993,1931],{"class":456},[412,1995,1997],{"class":414,"line":1996},12,[412,1998,1999],{"class":429},"  }\n",[412,2001,2003],{"class":414,"line":2002},13,[412,2004,800],{"class":429},[353,2006,2008],{"id":2007},"_3-animações-imperfeitas","3. Animações \"Imperfeitas\"",[343,2010,2012],{"className":1640,"code":2011,"language":1642,"meta":351,"style":351},".paper-hover {\n  transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);\n}\n\n.paper-hover:hover {\n  transform: translateY(-2px) rotate(0.5deg);\n  filter: drop-shadow(2px 2px 4px rgba(0,0,0,0.15));\n}\n",[338,2013,2014,2023,2064,2068,2072,2085,2114,2159],{"__ignoreMap":351},[412,2015,2016,2018,2021],{"class":414,"line":415},[412,2017,588],{"class":1649},[412,2019,2020],{"class":759},"paper-hover",[412,2022,741],{"class":429},[412,2024,2025,2028,2030,2033,2036,2038,2041,2043,2046,2048,2051,2053,2056,2058,2061],{"class":414,"line":422},[412,2026,2027],{"class":1658},"  transition",[412,2029,399],{"class":429},[412,2031,2032],{"class":433}," all",[412,2034,2035],{"class":1670}," 0.3",[412,2037,1724],{"class":1674},[412,2039,2040],{"class":1664}," cubic-bezier",[412,2042,453],{"class":429},[412,2044,2045],{"class":1670},"0.25",[412,2047,466],{"class":429},[412,2049,2050],{"class":1670}," 0.46",[412,2052,466],{"class":429},[412,2054,2055],{"class":1670}," 0.45",[412,2057,466],{"class":429},[412,2059,2060],{"class":1670}," 0.94",[412,2062,2063],{"class":429},");\n",[412,2065,2066],{"class":414,"line":568},[412,2067,800],{"class":429},[412,2069,2070],{"class":414,"line":604},[412,2071,1745],{"emptyLinePlaceholder":37},[412,2073,2074,2076,2078,2080,2083],{"class":414,"line":635},[412,2075,588],{"class":1649},[412,2077,2020],{"class":759},[412,2079,399],{"class":1649},[412,2081,2082],{"class":1454},"hover",[412,2084,741],{"class":429},[412,2086,2087,2090,2092,2095,2097,2100,2102,2104,2106,2108,2110,2112],{"class":414,"line":797},[412,2088,2089],{"class":1658},"  transform",[412,2091,399],{"class":429},[412,2093,2094],{"class":1664}," translateY",[412,2096,453],{"class":429},[412,2098,2099],{"class":1670},"-2",[412,2101,1675],{"class":1674},[412,2103,597],{"class":429},[412,2105,1784],{"class":1664},[412,2107,453],{"class":429},[412,2109,1814],{"class":1670},[412,2111,1791],{"class":1674},[412,2113,2063],{"class":429},[412,2115,2116,2118,2120,2122,2124,2126,2128,2131,2133,2136,2138,2140,2142,2144,2146,2148,2150,2152,2154,2157],{"class":414,"line":1566},[412,2117,1659],{"class":1658},[412,2119,399],{"class":429},[412,2121,1665],{"class":1664},[412,2123,453],{"class":429},[412,2125,1558],{"class":1670},[412,2127,1675],{"class":1674},[412,2129,2130],{"class":1670}," 2",[412,2132,1675],{"class":1674},[412,2134,2135],{"class":1670}," 4",[412,2137,1675],{"class":1674},[412,2139,1688],{"class":1664},[412,2141,453],{"class":429},[412,2143,1693],{"class":1670},[412,2145,466],{"class":429},[412,2147,1693],{"class":1670},[412,2149,466],{"class":429},[412,2151,1693],{"class":1670},[412,2153,466],{"class":429},[412,2155,2156],{"class":1670},"0.15",[412,2158,1709],{"class":429},[412,2160,2161],{"class":414,"line":1576},[412,2162,800],{"class":429},[330,2164,2166],{"id":2165},"a-evolução-técnica","🚀 A Evolução Técnica",[353,2168,2170],{"id":2169},"versão-01-o-conceito","Versão 0.1 - O Conceito",[343,2172,2174],{"className":909,"code":2173,"language":911,"meta":351,"style":351},"\u003C!-- Primeira versão - apenas CSS -->\n\u003Ctemplate>\n  \u003Cbutton class=\"paper-btn paper-btn--primary\">\n    {{ text }}\n  \u003C\u002Fbutton>\n\u003C\u002Ftemplate>\n",[338,2175,2176,2181,2189,2209,2214,2222],{"__ignoreMap":351},[412,2177,2178],{"class":414,"line":415},[412,2179,2180],{"class":418},"\u003C!-- Primeira versão - apenas CSS -->\n",[412,2182,2183,2185,2187],{"class":414,"line":422},[412,2184,756],{"class":429},[412,2186,926],{"class":925},[412,2188,929],{"class":429},[412,2190,2191,2193,2196,2198,2200,2202,2205,2207],{"class":414,"line":568},[412,2192,934],{"class":429},[412,2194,2195],{"class":925},"button",[412,2197,1455],{"class":1454},[412,2199,1458],{"class":429},[412,2201,1461],{"class":456},[412,2203,2204],{"class":460},"paper-btn paper-btn--primary",[412,2206,1461],{"class":456},[412,2208,929],{"class":429},[412,2210,2211],{"class":414,"line":604},[412,2212,2213],{"class":452},"    {{ text }}\n",[412,2215,2216,2218,2220],{"class":414,"line":635},[412,2217,955],{"class":429},[412,2219,2195],{"class":925},[412,2221,929],{"class":429},[412,2223,2224,2226,2228],{"class":414,"line":797},[412,2225,964],{"class":429},[412,2227,926],{"class":925},[412,2229,929],{"class":429},[353,2231,2233],{"id":2232},"versão-05-componentes-vue","Versão 0.5 - Componentes Vue",[343,2235,2237],{"className":909,"code":2236,"language":911,"meta":351,"style":351},"\u003C!-- Segunda versão - componentes Vue -->\n\u003Ctemplate>\n  \u003CPaperButton \n    variant=\"primary\" \n    size=\"large\"\n    :shaky=\"true\"\n  >\n    {{ text }}\n  \u003C\u002FPaperButton>\n\u003C\u002Ftemplate>\n",[338,2238,2239,2244,2252,2261,2277,2292,2310,2315,2319,2327],{"__ignoreMap":351},[412,2240,2241],{"class":414,"line":415},[412,2242,2243],{"class":418},"\u003C!-- Segunda versão - componentes Vue -->\n",[412,2245,2246,2248,2250],{"class":414,"line":422},[412,2247,756],{"class":429},[412,2249,926],{"class":925},[412,2251,929],{"class":429},[412,2253,2254,2256,2259],{"class":414,"line":568},[412,2255,934],{"class":429},[412,2257,2258],{"class":925},"PaperButton",[412,2260,565],{"class":429},[412,2262,2263,2266,2268,2270,2273,2275],{"class":414,"line":604},[412,2264,2265],{"class":1454},"    variant",[412,2267,1458],{"class":429},[412,2269,1461],{"class":456},[412,2271,2272],{"class":460},"primary",[412,2274,1461],{"class":456},[412,2276,565],{"class":429},[412,2278,2279,2282,2284,2286,2289],{"class":414,"line":635},[412,2280,2281],{"class":1454},"    size",[412,2283,1458],{"class":429},[412,2285,1461],{"class":456},[412,2287,2288],{"class":460},"large",[412,2290,2291],{"class":456},"\"\n",[412,2293,2294,2297,2300,2302,2304,2308],{"class":414,"line":797},[412,2295,2296],{"class":429},"    :",[412,2298,2299],{"class":1454},"shaky",[412,2301,1458],{"class":429},[412,2303,1461],{"class":456},[412,2305,2307],{"class":2306},"syTEX","true",[412,2309,2291],{"class":456},[412,2311,2312],{"class":414,"line":1566},[412,2313,2314],{"class":429},"  >\n",[412,2316,2317],{"class":414,"line":1576},[412,2318,2213],{"class":452},[412,2320,2321,2323,2325],{"class":414,"line":1605},[412,2322,955],{"class":429},[412,2324,2258],{"class":925},[412,2326,929],{"class":429},[412,2328,2329,2331,2333],{"class":414,"line":1614},[412,2330,964],{"class":429},[412,2332,926],{"class":925},[412,2334,929],{"class":429},[353,2336,2338],{"id":2337},"versão-10-módulo-nuxt","Versão 1.0 - Módulo Nuxt",[343,2340,2342],{"className":406,"code":2341,"language":408,"meta":351,"style":351},"\u002F\u002F nuxt.config.ts\nexport default defineNuxtConfig({\n  modules: ['@paper-ui\u002Fnuxt']\n})\n",[338,2343,2344,2349,2364,2384],{"__ignoreMap":351},[412,2345,2346],{"class":414,"line":415},[412,2347,2348],{"class":418},"\u002F\u002F nuxt.config.ts\n",[412,2350,2351,2353,2356,2359,2361],{"class":414,"line":422},[412,2352,725],{"class":444},[412,2354,2355],{"class":444}," default",[412,2357,2358],{"class":448}," defineNuxtConfig",[412,2360,453],{"class":452},[412,2362,2363],{"class":429},"{\n",[412,2365,2366,2369,2371,2374,2376,2379,2381],{"class":414,"line":568},[412,2367,2368],{"class":610},"  modules",[412,2370,399],{"class":429},[412,2372,2373],{"class":452}," [",[412,2375,457],{"class":456},[412,2377,2378],{"class":460},"@paper-ui\u002Fnuxt",[412,2380,457],{"class":456},[412,2382,2383],{"class":452},"]\n",[412,2385,2386,2389],{"class":414,"line":604},[412,2387,2388],{"class":429},"}",[412,2390,638],{"class":452},[330,2392,2394],{"id":2393},"números-impressionantes","📊 Números Impressionantes",[353,2396,2398],{"id":2397},"crescimento-orgânico","Crescimento Orgânico",[358,2400,2401,2407,2413,2419],{},[361,2402,2403,2406],{},[325,2404,2405],{},"GitHub Stars",": 0 → 2.3k em 6 meses",[361,2408,2409,2412],{},[325,2410,2411],{},"Downloads NPM",": 0 → 15k\u002Fmês",[361,2414,2415,2418],{},[325,2416,2417],{},"Projetos usando",": 0 → 500+",[361,2420,2421,2424],{},[325,2422,2423],{},"Contribuidores",": 1 → 12",[353,2426,845],{"id":844},[343,2428,2430],{"className":406,"code":2429,"language":408,"meta":351,"style":351},"\u002F\u002F Projetos que adotaram Paper UI\nconst projects = [\n  'E-commerce de artesanato',\n  'Plataforma educacional infantil', \n  'App de receitas caseiras',\n  'Sistema de gestão criativa'\n]\n",[338,2431,2432,2437,2449,2460,2473,2484,2493],{"__ignoreMap":351},[412,2433,2434],{"class":414,"line":415},[412,2435,2436],{"class":418},"\u002F\u002F Projetos que adotaram Paper UI\n",[412,2438,2439,2441,2444,2446],{"class":414,"line":422},[412,2440,426],{"class":425},[412,2442,2443],{"class":433}," projects",[412,2445,441],{"class":440},[412,2447,2448],{"class":452}," [\n",[412,2450,2451,2453,2456,2458],{"class":414,"line":568},[412,2452,1872],{"class":456},[412,2454,2455],{"class":460},"E-commerce de artesanato",[412,2457,457],{"class":456},[412,2459,1900],{"class":429},[412,2461,2462,2464,2467,2469,2471],{"class":414,"line":604},[412,2463,1872],{"class":456},[412,2465,2466],{"class":460},"Plataforma educacional infantil",[412,2468,457],{"class":456},[412,2470,466],{"class":429},[412,2472,565],{"class":452},[412,2474,2475,2477,2480,2482],{"class":414,"line":635},[412,2476,1872],{"class":456},[412,2478,2479],{"class":460},"App de receitas caseiras",[412,2481,457],{"class":456},[412,2483,1900],{"class":429},[412,2485,2486,2488,2491],{"class":414,"line":797},[412,2487,1872],{"class":456},[412,2489,2490],{"class":460},"Sistema de gestão criativa",[412,2492,1931],{"class":456},[412,2494,2495],{"class":414,"line":1566},[412,2496,2383],{"class":452},[330,2498,2500],{"id":2499},"os-princípios-de-design","🎯 Os Princípios de Design",[353,2502,2504],{"id":2503},"_1-imperfeição-perfeita","1. Imperfeição Perfeita",[343,2506,2508],{"className":1640,"code":2507,"language":1642,"meta":351,"style":351},".paper-element {\n  border-radius: 8px 12px 6px 10px; \u002F* Bordas irregulares *\u002F\n  transform: rotate(-0.5deg); \u002F* Leve inclinação *\u002F\n}\n",[338,2509,2510,2519,2552,2572],{"__ignoreMap":351},[412,2511,2512,2514,2517],{"class":414,"line":415},[412,2513,588],{"class":1649},[412,2515,2516],{"class":759},"paper-element",[412,2518,741],{"class":429},[412,2520,2521,2524,2526,2529,2531,2534,2536,2539,2541,2544,2546,2549],{"class":414,"line":422},[412,2522,2523],{"class":1658},"  border-radius",[412,2525,399],{"class":429},[412,2527,2528],{"class":1670}," 8",[412,2530,1675],{"class":1674},[412,2532,2533],{"class":1670}," 12",[412,2535,1675],{"class":1674},[412,2537,2538],{"class":1670}," 6",[412,2540,1675],{"class":1674},[412,2542,2543],{"class":1670}," 10",[412,2545,1675],{"class":1674},[412,2547,2548],{"class":429},";",[412,2550,2551],{"class":418}," \u002F* Bordas irregulares *\u002F\n",[412,2553,2554,2556,2558,2560,2562,2565,2567,2569],{"class":414,"line":568},[412,2555,2089],{"class":1658},[412,2557,399],{"class":429},[412,2559,1784],{"class":1664},[412,2561,453],{"class":429},[412,2563,2564],{"class":1670},"-0.5",[412,2566,1791],{"class":1674},[412,2568,1794],{"class":429},[412,2570,2571],{"class":418}," \u002F* Leve inclinação *\u002F\n",[412,2573,2574],{"class":414,"line":604},[412,2575,800],{"class":429},[353,2577,2579],{"id":2578},"_2-texturas-visuais","2. Texturas Visuais",[343,2581,2583],{"className":1640,"code":2582,"language":1642,"meta":351,"style":351},".paper-texture {\n  background-image: \n    radial-gradient(circle at 20% 80%, rgba(255,255,255,0.1) 0%, transparent 50%),\n    radial-gradient(circle at 80% 20%, rgba(0,0,0,0.05) 0%, transparent 50%);\n}\n",[338,2584,2585,2594,2603,2667,2722],{"__ignoreMap":351},[412,2586,2587,2589,2592],{"class":414,"line":415},[412,2588,588],{"class":1649},[412,2590,2591],{"class":759},"paper-texture",[412,2593,741],{"class":429},[412,2595,2596,2599,2601],{"class":414,"line":422},[412,2597,2598],{"class":1658},"  background-image",[412,2600,399],{"class":429},[412,2602,565],{"class":452},[412,2604,2605,2608,2610,2613,2616,2619,2622,2625,2627,2629,2631,2633,2636,2638,2640,2642,2644,2646,2648,2650,2652,2654,2656,2659,2662,2664],{"class":414,"line":568},[412,2606,2607],{"class":1664},"    radial-gradient",[412,2609,453],{"class":429},[412,2611,2612],{"class":433},"circle",[412,2614,2615],{"class":440}," at",[412,2617,2618],{"class":1670}," 20",[412,2620,2621],{"class":1674},"%",[412,2623,2624],{"class":1670}," 80",[412,2626,2621],{"class":1674},[412,2628,466],{"class":429},[412,2630,1688],{"class":1664},[412,2632,453],{"class":429},[412,2634,2635],{"class":1670},"255",[412,2637,466],{"class":429},[412,2639,2635],{"class":1670},[412,2641,466],{"class":429},[412,2643,2635],{"class":1670},[412,2645,466],{"class":429},[412,2647,1706],{"class":1670},[412,2649,597],{"class":429},[412,2651,1683],{"class":1670},[412,2653,2621],{"class":1674},[412,2655,466],{"class":429},[412,2657,2658],{"class":433}," transparent",[412,2660,2661],{"class":1670}," 50",[412,2663,2621],{"class":1674},[412,2665,2666],{"class":429},"),\n",[412,2668,2669,2671,2673,2675,2677,2679,2681,2683,2685,2687,2689,2691,2693,2695,2697,2699,2701,2703,2706,2708,2710,2712,2714,2716,2718,2720],{"class":414,"line":604},[412,2670,2607],{"class":1664},[412,2672,453],{"class":429},[412,2674,2612],{"class":433},[412,2676,2615],{"class":440},[412,2678,2624],{"class":1670},[412,2680,2621],{"class":1674},[412,2682,2618],{"class":1670},[412,2684,2621],{"class":1674},[412,2686,466],{"class":429},[412,2688,1688],{"class":1664},[412,2690,453],{"class":429},[412,2692,1693],{"class":1670},[412,2694,466],{"class":429},[412,2696,1693],{"class":1670},[412,2698,466],{"class":429},[412,2700,1693],{"class":1670},[412,2702,466],{"class":429},[412,2704,2705],{"class":1670},"0.05",[412,2707,597],{"class":429},[412,2709,1683],{"class":1670},[412,2711,2621],{"class":1674},[412,2713,466],{"class":429},[412,2715,2658],{"class":433},[412,2717,2661],{"class":1670},[412,2719,2621],{"class":1674},[412,2721,2063],{"class":429},[412,2723,2724],{"class":414,"line":635},[412,2725,800],{"class":429},[353,2727,2729],{"id":2728},"_3-interações-humanas","3. Interações Humanas",[343,2731,2733],{"className":406,"code":2732,"language":408,"meta":351,"style":351},"\u002F\u002F Hover effects que simulam toque humano\nconst humanHover = {\n  transform: 'translateY(-1px) rotate(0.3deg)',\n  transition: 'all 0.2s ease-out'\n}\n",[338,2734,2735,2740,2751,2766,2779],{"__ignoreMap":351},[412,2736,2737],{"class":414,"line":415},[412,2738,2739],{"class":418},"\u002F\u002F Hover effects que simulam toque humano\n",[412,2741,2742,2744,2747,2749],{"class":414,"line":422},[412,2743,426],{"class":425},[412,2745,2746],{"class":433}," humanHover",[412,2748,441],{"class":440},[412,2750,741],{"class":429},[412,2752,2753,2755,2757,2759,2762,2764],{"class":414,"line":568},[412,2754,2089],{"class":610},[412,2756,399],{"class":429},[412,2758,1892],{"class":456},[412,2760,2761],{"class":460},"translateY(-1px) rotate(0.3deg)",[412,2763,457],{"class":456},[412,2765,1900],{"class":429},[412,2767,2768,2770,2772,2774,2777],{"class":414,"line":604},[412,2769,2027],{"class":610},[412,2771,399],{"class":429},[412,2773,1892],{"class":456},[412,2775,2776],{"class":460},"all 0.2s ease-out",[412,2778,1931],{"class":456},[412,2780,2781],{"class":414,"line":635},[412,2782,800],{"class":429},[330,2784,2786],{"id":2785},"momentos-marcantes","🌟 Momentos Marcantes",[353,2788,2790],{"id":2789},"_1-primeira-estrela-no-github","1. Primeira Estrela no GitHub",[321,2792,2793],{},"Recebi a primeira estrela de um desenvolvedor do Japão que disse:",[1376,2795,2796],{},[321,2797,2798],{},[1235,2799,2800],{},"\"This library brings warmth to my cold, corporate interfaces. Arigato!\"",[353,2802,2804],{"id":2803},"_2-adoção-pelo-nuxtjs","2. Adoção pelo Nuxt.js",[321,2806,2807,2808,588],{},"Quando o time do Nuxt.js me contatou para tornar a Paper UI um módulo oficial, foi um momento de ",[325,2809,2810],{},"realização profissional",[353,2812,2814],{"id":2813},"_3-feedback-de-usuários","3. Feedback de Usuários",[343,2816,2818],{"className":406,"code":2817,"language":408,"meta":351,"style":351},"\u002F\u002F Comentários que me motivaram\nconst feedback = [\n  \"Finally, interfaces with personality!\",\n  \"My users love the warm, human feel\",\n  \"This changed how I think about UI design\",\n  \"Perfect for creative projects\"\n]\n",[338,2819,2820,2825,2836,2848,2859,2870,2879],{"__ignoreMap":351},[412,2821,2822],{"class":414,"line":415},[412,2823,2824],{"class":418},"\u002F\u002F Comentários que me motivaram\n",[412,2826,2827,2829,2832,2834],{"class":414,"line":422},[412,2828,426],{"class":425},[412,2830,2831],{"class":433}," feedback",[412,2833,441],{"class":440},[412,2835,2448],{"class":452},[412,2837,2838,2841,2844,2846],{"class":414,"line":568},[412,2839,2840],{"class":456},"  \"",[412,2842,2843],{"class":460},"Finally, interfaces with personality!",[412,2845,1461],{"class":456},[412,2847,1900],{"class":429},[412,2849,2850,2852,2855,2857],{"class":414,"line":604},[412,2851,2840],{"class":456},[412,2853,2854],{"class":460},"My users love the warm, human feel",[412,2856,1461],{"class":456},[412,2858,1900],{"class":429},[412,2860,2861,2863,2866,2868],{"class":414,"line":635},[412,2862,2840],{"class":456},[412,2864,2865],{"class":460},"This changed how I think about UI design",[412,2867,1461],{"class":456},[412,2869,1900],{"class":429},[412,2871,2872,2874,2877],{"class":414,"line":797},[412,2873,2840],{"class":456},[412,2875,2876],{"class":460},"Perfect for creative projects",[412,2878,2291],{"class":456},[412,2880,2881],{"class":414,"line":1566},[412,2882,2383],{"class":452},[330,2884,2886],{"id":2885},"️-lições-aprendidas","🛠️ Lições Aprendidas",[353,2888,2890],{"id":2889},"_1-tecnologia-emoção","1. Tecnologia + Emoção",[321,2892,2893,2894,2897],{},"A Paper UI me ensinou que ",[325,2895,2896],{},"tecnologia sem emoção é apenas código",". As melhores soluções conectam-se com as pessoas.",[353,2899,2901],{"id":2900},"_2-imperfeição-como-virtude","2. Imperfeição como Virtude",[321,2903,2904,2905,2908],{},"Em um mundo de pixels perfeitos, ",[325,2906,2907],{},"imperfeições controladas"," podem ser mais eficazes que a perfeição absoluta.",[353,2910,2912],{"id":2911},"_3-comunidade-é-tudo","3. Comunidade é Tudo",[321,2914,2915,2916,2919],{},"O sucesso da Paper UI não foi apenas técnico - foi sobre ",[325,2917,2918],{},"construir uma comunidade"," de desenvolvedores que valorizam design humano.",[330,2921,2923],{"id":2922},"o-futuro-da-paper-ui","🔮 O Futuro da Paper UI",[353,2925,2927],{"id":2926},"próximas-funcionalidades","Próximas Funcionalidades",[358,2929,2930,2936,2942,2948],{},[361,2931,2932,2935],{},[325,2933,2934],{},"Paper AI",": Geração automática de texturas",[361,2937,2938,2941],{},[325,2939,2940],{},"Paper Themes",": Temas sazonais e culturais",[361,2943,2944,2947],{},[325,2945,2946],{},"Paper Animations",": Micro-interações mais sofisticadas",[361,2949,2950,2953],{},[325,2951,2952],{},"Paper Accessibility",": Foco em acessibilidade sem perder a personalidade",[353,2955,2957],{"id":2956},"visão-de-longo-prazo","Visão de Longo Prazo",[343,2959,2961],{"className":406,"code":2960,"language":408,"meta":351,"style":351},"\u002F\u002F Paper UI 2.0 - Conceito\nconst vision = {\n  goal: \"Democratizar design humano na web\",\n  mission: \"Tornar interfaces mais acolhedoras e memoráveis\",\n  impact: \"Conectar tecnologia com emoção humana\"\n}\n",[338,2962,2963,2968,2979,2996,3012,3026],{"__ignoreMap":351},[412,2964,2965],{"class":414,"line":415},[412,2966,2967],{"class":418},"\u002F\u002F Paper UI 2.0 - Conceito\n",[412,2969,2970,2972,2975,2977],{"class":414,"line":422},[412,2971,426],{"class":425},[412,2973,2974],{"class":433}," vision",[412,2976,441],{"class":440},[412,2978,741],{"class":429},[412,2980,2981,2984,2986,2989,2992,2994],{"class":414,"line":568},[412,2982,2983],{"class":610},"  goal",[412,2985,399],{"class":429},[412,2987,2988],{"class":456}," \"",[412,2990,2991],{"class":460},"Democratizar design humano na web",[412,2993,1461],{"class":456},[412,2995,1900],{"class":429},[412,2997,2998,3001,3003,3005,3008,3010],{"class":414,"line":604},[412,2999,3000],{"class":610},"  mission",[412,3002,399],{"class":429},[412,3004,2988],{"class":456},[412,3006,3007],{"class":460},"Tornar interfaces mais acolhedoras e memoráveis",[412,3009,1461],{"class":456},[412,3011,1900],{"class":429},[412,3013,3014,3017,3019,3021,3024],{"class":414,"line":635},[412,3015,3016],{"class":610},"  impact",[412,3018,399],{"class":429},[412,3020,2988],{"class":456},[412,3022,3023],{"class":460},"Conectar tecnologia com emoção humana",[412,3025,2291],{"class":456},[412,3027,3028],{"class":414,"line":797},[412,3029,800],{"class":429},[330,3031,3033],{"id":3032},"dicas-para-criar-sua-própria-biblioteca","💡 Dicas para Criar Sua Própria Biblioteca",[353,3035,3037],{"id":3036},"_1-identifique-um-problema-real","1. Identifique um Problema Real",[321,3039,3040,3041,3044],{},"Não crie por criar. ",[325,3042,3043],{},"Identifique uma dor real"," que você sente no dia a dia.",[353,3046,3048],{"id":3047},"_2-comece-simples","2. Comece Simples",[343,3050,3052],{"className":909,"code":3051,"language":911,"meta":351,"style":351},"\u003C!-- Comece com um componente -->\n\u003Ctemplate>\n  \u003Cdiv class=\"your-idea\">\n    \u003C!-- Implementação simples -->\n  \u003C\u002Fdiv>\n\u003C\u002Ftemplate>\n",[338,3053,3054,3059,3067,3086,3091,3099],{"__ignoreMap":351},[412,3055,3056],{"class":414,"line":415},[412,3057,3058],{"class":418},"\u003C!-- Comece com um componente -->\n",[412,3060,3061,3063,3065],{"class":414,"line":422},[412,3062,756],{"class":429},[412,3064,926],{"class":925},[412,3066,929],{"class":429},[412,3068,3069,3071,3073,3075,3077,3079,3082,3084],{"class":414,"line":568},[412,3070,934],{"class":429},[412,3072,937],{"class":925},[412,3074,1455],{"class":1454},[412,3076,1458],{"class":429},[412,3078,1461],{"class":456},[412,3080,3081],{"class":460},"your-idea",[412,3083,1461],{"class":456},[412,3085,929],{"class":429},[412,3087,3088],{"class":414,"line":604},[412,3089,3090],{"class":418},"    \u003C!-- Implementação simples -->\n",[412,3092,3093,3095,3097],{"class":414,"line":635},[412,3094,955],{"class":429},[412,3096,937],{"class":925},[412,3098,929],{"class":429},[412,3100,3101,3103,3105],{"class":414,"line":797},[412,3102,964],{"class":429},[412,3104,926],{"class":925},[412,3106,929],{"class":429},[353,3108,3110],{"id":3109},"_3-documente-tudo","3. Documente Tudo",[343,3112,3116],{"className":3113,"code":3114,"language":3115,"meta":351,"style":351},"language-markdown shiki shiki-themes material-theme-lighter github-light github-dark","# Sua Biblioteca\n## Instalação\n## Uso\n## Exemplos\n## Contribuição\n","markdown",[338,3117,3118,3123,3128,3133,3138],{"__ignoreMap":351},[412,3119,3120],{"class":414,"line":415},[412,3121,3122],{},"# Sua Biblioteca\n",[412,3124,3125],{"class":414,"line":422},[412,3126,3127],{},"## Instalação\n",[412,3129,3130],{"class":414,"line":568},[412,3131,3132],{},"## Uso\n",[412,3134,3135],{"class":414,"line":604},[412,3136,3137],{},"## Exemplos\n",[412,3139,3140],{"class":414,"line":635},[412,3141,3142],{},"## Contribuição\n",[353,3144,3146],{"id":3145},"_4-engaje-a-comunidade","4. Engaje a Comunidade",[358,3148,3149,3154,3159,3164],{},[361,3150,3151],{},[325,3152,3153],{},"GitHub Discussions",[361,3155,3156],{},[325,3157,3158],{},"Discord\u002FSlack",[361,3160,3161],{},[325,3162,3163],{},"Twitter\u002FLinkedIn",[361,3165,3166],{},[325,3167,3168],{},"Blog posts técnicos",[330,3170,1181],{"id":1180},[321,3172,1314,3173,3175,3176,3179],{},[325,3174,202],{}," nasceu de uma frustração pessoal e se tornou uma ferramenta que ",[325,3177,3178],{},"humaniza a web",". Ela me ensinou que:",[358,3181,3182,3187,3192,3197],{},[361,3183,3184],{},[325,3185,3186],{},"Tecnologia pode ser emocional",[361,3188,3189],{},[325,3190,3191],{},"Imperfeição pode ser perfeita",[361,3193,3194],{},[325,3195,3196],{},"Comunidade move montanhas",[361,3198,3199],{},[325,3200,3201],{},"Ideias simples podem revolucionar",[321,3203,3204,3207],{},[325,3205,3206],{},"Para desenvolvedores",": Não tenham medo de experimentar. As melhores soluções nascem de problemas reais e paixão genuína.",[321,3209,3210,3213,3214,3217],{},[325,3211,3212],{},"Para designers",": Lembrem-se que ",[325,3215,3216],{},"interface é conversa",". A Paper UI prova que podemos ter conversas mais humanas através da tecnologia.",[1230,3219],{},[321,3221,3222],{},[1235,3223,3224,3225,3230],{},"Quer contribuir com a Paper UI? Visite ",[1239,3226,3229],{"href":3227,"rel":3228},"https:\u002F\u002Fpaper-docs.nuxt.space",[1243],"paper-docs.nuxt.space"," e junte-se à comunidade que está humanizando a web!",[321,3232,3233],{},[1235,3234,3235,3236,3239],{},"Siga-me no ",[1239,3237,24],{"href":1241,"rel":3238},[1243]," para mais insights sobre desenvolvimento e design.",[1246,3241,3242],{},"html pre.shiki code .sutJx, html code.shiki .sutJx{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#6A737D;--shiki-default-font-style:inherit;--shiki-dark:#6A737D;--shiki-dark-font-style:inherit}html pre.shiki code .sP7_E, html code.shiki .sP7_E{--shiki-light:#39ADB5;--shiki-default:#24292E;--shiki-dark:#E1E4E8}html pre.shiki code .sQzsp, html code.shiki .sQzsp{--shiki-light:#E53935;--shiki-default:#22863A;--shiki-dark:#85E89D}html pre.shiki code .s9AJx, html code.shiki .s9AJx{--shiki-light:#9C3EDA;--shiki-default:#6F42C1;--shiki-dark:#B392F0}html pre.shiki code .sjJ54, html code.shiki .sjJ54{--shiki-light:#39ADB5;--shiki-default:#032F62;--shiki-dark:#9ECBFF}html pre.shiki code .s_sjI, html code.shiki .s_sjI{--shiki-light:#91B859;--shiki-default:#032F62;--shiki-dark:#9ECBFF}html pre.shiki code .su5hD, html code.shiki .su5hD{--shiki-light:#90A4AE;--shiki-default:#24292E;--shiki-dark:#E1E4E8}html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html pre.shiki code .stp6e, html code.shiki .stp6e{--shiki-light:#39ADB5;--shiki-default:#6F42C1;--shiki-dark:#B392F0}html pre.shiki code .sbgvK, html code.shiki .sbgvK{--shiki-light:#E2931D;--shiki-default:#6F42C1;--shiki-dark:#B392F0}html pre.shiki code .soE4H, html code.shiki .soE4H{--shiki-light:#8796B0;--shiki-default:#005CC5;--shiki-dark:#79B8FF}html pre.shiki code .sptTA, html code.shiki .sptTA{--shiki-light:#6182B8;--shiki-default:#005CC5;--shiki-dark:#79B8FF}html pre.shiki code .srdBf, html code.shiki .srdBf{--shiki-light:#F76D47;--shiki-default:#005CC5;--shiki-dark:#79B8FF}html pre.shiki code .sw1J6, html code.shiki .sw1J6{--shiki-light:#F76D47;--shiki-default:#D73A49;--shiki-dark:#F97583}html pre.shiki code .s_hVV, html code.shiki .s_hVV{--shiki-light:#90A4AE;--shiki-default:#005CC5;--shiki-dark:#79B8FF}html pre.shiki code .sVHd0, html code.shiki .sVHd0{--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#D73A49;--shiki-default-font-style:inherit;--shiki-dark:#F97583;--shiki-dark-font-style:inherit}html pre.shiki code .s99_P, html code.shiki .s99_P{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#E36209;--shiki-default-font-style:inherit;--shiki-dark:#FFAB70;--shiki-dark-font-style:inherit}html pre.shiki code .sbsja, html code.shiki .sbsja{--shiki-light:#9C3EDA;--shiki-default:#D73A49;--shiki-dark:#F97583}html pre.shiki code .smGrS, html code.shiki .smGrS{--shiki-light:#39ADB5;--shiki-default:#D73A49;--shiki-dark:#F97583}html pre.shiki code .sZUrc, html code.shiki .sZUrc{--shiki-light:#E53935;--shiki-default:#032F62;--shiki-dark:#9ECBFF}html pre.shiki code .skxfh, html code.shiki .skxfh{--shiki-light:#E53935;--shiki-default:#24292E;--shiki-dark:#E1E4E8}html pre.shiki code .syTEX, html code.shiki .syTEX{--shiki-light:#FF5370;--shiki-default:#005CC5;--shiki-dark:#79B8FF}html pre.shiki code .sGLFI, html code.shiki .sGLFI{--shiki-light:#6182B8;--shiki-default:#6F42C1;--shiki-dark:#B392F0}",{"title":351,"searchDepth":422,"depth":422,"links":3244},[3245,3249,3253,3258,3263,3267,3272,3277,3282,3286,3292],{"id":1327,"depth":422,"text":1328,"children":3246},[3247,3248],{"id":1331,"depth":568,"text":1332},{"id":1370,"depth":568,"text":1371},{"id":1385,"depth":422,"text":1386,"children":3250},[3251,3252],{"id":1389,"depth":568,"text":1390},{"id":1426,"depth":568,"text":1427},{"id":1629,"depth":422,"text":1630,"children":3254},[3255,3256,3257],{"id":1633,"depth":568,"text":1634},{"id":1845,"depth":568,"text":1846},{"id":2007,"depth":568,"text":2008},{"id":2165,"depth":422,"text":2166,"children":3259},[3260,3261,3262],{"id":2169,"depth":568,"text":2170},{"id":2232,"depth":568,"text":2233},{"id":2337,"depth":568,"text":2338},{"id":2393,"depth":422,"text":2394,"children":3264},[3265,3266],{"id":2397,"depth":568,"text":2398},{"id":844,"depth":568,"text":845},{"id":2499,"depth":422,"text":2500,"children":3268},[3269,3270,3271],{"id":2503,"depth":568,"text":2504},{"id":2578,"depth":568,"text":2579},{"id":2728,"depth":568,"text":2729},{"id":2785,"depth":422,"text":2786,"children":3273},[3274,3275,3276],{"id":2789,"depth":568,"text":2790},{"id":2803,"depth":568,"text":2804},{"id":2813,"depth":568,"text":2814},{"id":2885,"depth":422,"text":2886,"children":3278},[3279,3280,3281],{"id":2889,"depth":568,"text":2890},{"id":2900,"depth":568,"text":2901},{"id":2911,"depth":568,"text":2912},{"id":2922,"depth":422,"text":2923,"children":3283},[3284,3285],{"id":2926,"depth":568,"text":2927},{"id":2956,"depth":568,"text":2957},{"id":3032,"depth":422,"text":3033,"children":3287},[3288,3289,3290,3291],{"id":3036,"depth":568,"text":3037},{"id":3047,"depth":568,"text":3048},{"id":3109,"depth":568,"text":3110},{"id":3145,"depth":568,"text":3146},{"id":1180,"depth":422,"text":1181},"2024-12-18","Descubra como nasceu a Paper UI, os desafios técnicos enfrentados e como uma ideia simples se tornou um módulo oficial do Nuxt.js.","\u002Fpaper.gif",{"author":3297},{"name":1294,"avatar":3298,"bio":1297,"social":3299},{"src":1296},{"github":1241,"linkedin":1299},"\u002Fblog\u002Fpaper-ui-historia-criacao",{"title":1309,"description":3294},"blog\u002Fpaper-ui-historia-criacao",[3304,3305,1304,911,3306],"paper-ui","design-system","criatividade","d6NfN4lY_0awwQTnd87pM29kDAMMbgcMbb12jZEUAoo",{"id":3309,"title":3310,"body":3311,"date":7535,"description":7536,"extension":1290,"image":7537,"meta":7538,"navigation":37,"path":7542,"seo":7543,"stem":7544,"tags":7545,"__hash__":7548},"blog\u002Fblog\u002Fnuxt-performance-otimizacoes-avancadas.md","Nuxt Performance: Otimizações Avançadas que Aumentaram 40% a Velocidade dos Meus Projetos",{"type":318,"value":3312,"toc":7481},[3313,3323,3327,3331,3357,3361,3381,3385,3389,3660,3664,3773,3777,3781,3928,3932,4073,4077,4081,4645,4649,4743,4747,4751,4952,4956,5169,5173,5177,5513,5517,5597,5601,5605,5780,5784,5946,5950,5954,6148,6152,6282,6286,6290,6505,6509,6696,6700,6704,6749,6753,7007,7011,7015,7132,7136,7140,7204,7208,7212,7219,7223,7332,7336,7421,7423,7430,7452,7462,7464,7473,7478],[321,3314,3315,3316,3319,3320,588],{},"Após 6 anos desenvolvendo com Nuxt.js, aprendi que ",[325,3317,3318],{},"performance não é acidente"," - é resultado de decisões técnicas conscientes. Neste artigo, compartilho as otimizações que implementei em projetos reais e que resultaram em ",[325,3321,3322],{},"melhorias mensuráveis de 40%+ na velocidade",[330,3324,3326],{"id":3325},"resultados-reais-dos-meus-projetos","📊 Resultados Reais dos Meus Projetos",[353,3328,3330],{"id":3329},"projeto-fluxxi-sistema-de-gestão","Projeto Fluxxi (Sistema de Gestão)",[358,3332,3333,3339,3345,3351],{},[361,3334,3335,3338],{},[325,3336,3337],{},"Lighthouse Performance",": 72 → 94 (+22 pontos)",[361,3340,3341,3344],{},[325,3342,3343],{},"First Contentful Paint",": 2.1s → 1.2s (-43%)",[361,3346,3347,3350],{},[325,3348,3349],{},"Largest Contentful Paint",": 3.8s → 2.1s (-45%)",[361,3352,3353,3356],{},[325,3354,3355],{},"Cumulative Layout Shift",": 0.15 → 0.02 (-87%)",[353,3358,3360],{"id":3359},"projeto-paper-ui-documentação","Projeto Paper UI (Documentação)",[358,3362,3363,3369,3375],{},[361,3364,3365,3368],{},[325,3366,3367],{},"Bundle Size",": 1.2MB → 680KB (-43%)",[361,3370,3371,3374],{},[325,3372,3373],{},"Build Time",": 4min 30s → 2min 45s (-39%)",[361,3376,3377,3380],{},[325,3378,3379],{},"Cold Start",": 6.2s → 3.8s (-39%)",[330,3382,3384],{"id":3383},"_1-bundle-splitting-inteligente","🚀 1. Bundle Splitting Inteligente",[353,3386,3388],{"id":3387},"estratégia-de-code-splitting","Estratégia de Code Splitting",[343,3390,3392],{"className":406,"code":3391,"language":408,"meta":351,"style":351},"\u002F\u002F nuxt.config.ts\nexport default defineNuxtConfig({\n  build: {\n    analyze: process.env.ANALYZE === 'true'\n  },\n  \n  nitro: {\n    rollupConfig: {\n      output: {\n        manualChunks: {\n          \u002F\u002F Vendor chunks otimizados\n          'vue-vendor': ['vue', 'vue-router'],\n          'nuxt-vendor': ['@nuxt\u002Fkit', '@nuxt\u002Fnitro'],\n          'ui-vendor': ['@headlessui\u002Fvue', '@heroicons\u002Fvue'],\n          'utils-vendor': ['lodash-es', 'date-fns']\n        }\n      }\n    }\n  }\n})\n",[338,3393,3394,3398,3410,3419,3448,3452,3457,3466,3475,3484,3493,3498,3532,3564,3598,3630,3636,3642,3648,3653],{"__ignoreMap":351},[412,3395,3396],{"class":414,"line":415},[412,3397,2348],{"class":418},[412,3399,3400,3402,3404,3406,3408],{"class":414,"line":422},[412,3401,725],{"class":444},[412,3403,2355],{"class":444},[412,3405,2358],{"class":448},[412,3407,453],{"class":452},[412,3409,2363],{"class":429},[412,3411,3412,3415,3417],{"class":414,"line":568},[412,3413,3414],{"class":610},"  build",[412,3416,399],{"class":429},[412,3418,741],{"class":429},[412,3420,3421,3424,3426,3429,3431,3434,3436,3439,3442,3444,3446],{"class":414,"line":604},[412,3422,3423],{"class":610},"    analyze",[412,3425,399],{"class":429},[412,3427,3428],{"class":452}," process",[412,3430,588],{"class":429},[412,3432,3433],{"class":452},"env",[412,3435,588],{"class":429},[412,3437,3438],{"class":433},"ANALYZE",[412,3440,3441],{"class":440}," ===",[412,3443,1892],{"class":456},[412,3445,2307],{"class":460},[412,3447,1931],{"class":456},[412,3449,3450],{"class":414,"line":635},[412,3451,1936],{"class":429},[412,3453,3454],{"class":414,"line":797},[412,3455,3456],{"class":452},"  \n",[412,3458,3459,3462,3464],{"class":414,"line":1566},[412,3460,3461],{"class":610},"  nitro",[412,3463,399],{"class":429},[412,3465,741],{"class":429},[412,3467,3468,3471,3473],{"class":414,"line":1576},[412,3469,3470],{"class":610},"    rollupConfig",[412,3472,399],{"class":429},[412,3474,741],{"class":429},[412,3476,3477,3480,3482],{"class":414,"line":1605},[412,3478,3479],{"class":610},"      output",[412,3481,399],{"class":429},[412,3483,741],{"class":429},[412,3485,3486,3489,3491],{"class":414,"line":1614},[412,3487,3488],{"class":610},"        manualChunks",[412,3490,399],{"class":429},[412,3492,741],{"class":429},[412,3494,3495],{"class":414,"line":1982},[412,3496,3497],{"class":418},"          \u002F\u002F Vendor chunks otimizados\n",[412,3499,3500,3503,3506,3508,3510,3512,3514,3516,3518,3520,3522,3525,3527,3530],{"class":414,"line":1996},[412,3501,3502],{"class":456},"          '",[412,3504,3505],{"class":1875},"vue-vendor",[412,3507,457],{"class":456},[412,3509,399],{"class":429},[412,3511,2373],{"class":452},[412,3513,457],{"class":456},[412,3515,911],{"class":460},[412,3517,457],{"class":456},[412,3519,466],{"class":429},[412,3521,1892],{"class":456},[412,3523,3524],{"class":460},"vue-router",[412,3526,457],{"class":456},[412,3528,3529],{"class":452},"]",[412,3531,1900],{"class":429},[412,3533,3534,3536,3539,3541,3543,3545,3547,3549,3551,3553,3555,3558,3560,3562],{"class":414,"line":2002},[412,3535,3502],{"class":456},[412,3537,3538],{"class":1875},"nuxt-vendor",[412,3540,457],{"class":456},[412,3542,399],{"class":429},[412,3544,2373],{"class":452},[412,3546,457],{"class":456},[412,3548,1092],{"class":460},[412,3550,457],{"class":456},[412,3552,466],{"class":429},[412,3554,1892],{"class":456},[412,3556,3557],{"class":460},"@nuxt\u002Fnitro",[412,3559,457],{"class":456},[412,3561,3529],{"class":452},[412,3563,1900],{"class":429},[412,3565,3567,3569,3572,3574,3576,3578,3580,3583,3585,3587,3589,3592,3594,3596],{"class":414,"line":3566},14,[412,3568,3502],{"class":456},[412,3570,3571],{"class":1875},"ui-vendor",[412,3573,457],{"class":456},[412,3575,399],{"class":429},[412,3577,2373],{"class":452},[412,3579,457],{"class":456},[412,3581,3582],{"class":460},"@headlessui\u002Fvue",[412,3584,457],{"class":456},[412,3586,466],{"class":429},[412,3588,1892],{"class":456},[412,3590,3591],{"class":460},"@heroicons\u002Fvue",[412,3593,457],{"class":456},[412,3595,3529],{"class":452},[412,3597,1900],{"class":429},[412,3599,3601,3603,3606,3608,3610,3612,3614,3617,3619,3621,3623,3626,3628],{"class":414,"line":3600},15,[412,3602,3502],{"class":456},[412,3604,3605],{"class":1875},"utils-vendor",[412,3607,457],{"class":456},[412,3609,399],{"class":429},[412,3611,2373],{"class":452},[412,3613,457],{"class":456},[412,3615,3616],{"class":460},"lodash-es",[412,3618,457],{"class":456},[412,3620,466],{"class":429},[412,3622,1892],{"class":456},[412,3624,3625],{"class":460},"date-fns",[412,3627,457],{"class":456},[412,3629,2383],{"class":452},[412,3631,3633],{"class":414,"line":3632},16,[412,3634,3635],{"class":429},"        }\n",[412,3637,3639],{"class":414,"line":3638},17,[412,3640,3641],{"class":429},"      }\n",[412,3643,3645],{"class":414,"line":3644},18,[412,3646,3647],{"class":429},"    }\n",[412,3649,3651],{"class":414,"line":3650},19,[412,3652,1999],{"class":429},[412,3654,3656,3658],{"class":414,"line":3655},20,[412,3657,2388],{"class":429},[412,3659,638],{"class":452},[353,3661,3663],{"id":3662},"resultado-prático","Resultado Prático",[343,3665,3667],{"className":1019,"code":3666,"language":1021,"meta":351,"style":351},"# Antes da otimização\ndist\u002F_nuxt\u002F\n├── index.js (1.2MB)\n├── vendor.js (800KB)\n└── app.js (400KB)\n\n# Depois da otimização  \ndist\u002F_nuxt\u002F\n├── index.js (200KB)\n├── vue-vendor.js (180KB)\n├── nuxt-vendor.js (120KB)\n├── ui-vendor.js (80KB)\n└── utils-vendor.js (60KB)\n",[338,3668,3669,3674,3679,3690,3700,3711,3715,3720,3724,3733,3743,3753,3763],{"__ignoreMap":351},[412,3670,3671],{"class":414,"line":415},[412,3672,3673],{"class":418},"# Antes da otimização\n",[412,3675,3676],{"class":414,"line":422},[412,3677,3678],{"class":759},"dist\u002F_nuxt\u002F\n",[412,3680,3681,3684,3687],{"class":414,"line":568},[412,3682,3683],{"class":759},"├──",[412,3685,3686],{"class":460}," index.js",[412,3688,3689],{"class":452}," (1.2MB)\n",[412,3691,3692,3694,3697],{"class":414,"line":604},[412,3693,3683],{"class":759},[412,3695,3696],{"class":460}," vendor.js",[412,3698,3699],{"class":452}," (800KB)\n",[412,3701,3702,3705,3708],{"class":414,"line":635},[412,3703,3704],{"class":759},"└──",[412,3706,3707],{"class":460}," app.js",[412,3709,3710],{"class":452}," (400KB)\n",[412,3712,3713],{"class":414,"line":797},[412,3714,1745],{"emptyLinePlaceholder":37},[412,3716,3717],{"class":414,"line":1566},[412,3718,3719],{"class":418},"# Depois da otimização  \n",[412,3721,3722],{"class":414,"line":1576},[412,3723,3678],{"class":759},[412,3725,3726,3728,3730],{"class":414,"line":1605},[412,3727,3683],{"class":759},[412,3729,3686],{"class":460},[412,3731,3732],{"class":452}," (200KB)\n",[412,3734,3735,3737,3740],{"class":414,"line":1614},[412,3736,3683],{"class":759},[412,3738,3739],{"class":460}," vue-vendor.js",[412,3741,3742],{"class":452}," (180KB)\n",[412,3744,3745,3747,3750],{"class":414,"line":1982},[412,3746,3683],{"class":759},[412,3748,3749],{"class":460}," nuxt-vendor.js",[412,3751,3752],{"class":452}," (120KB)\n",[412,3754,3755,3757,3760],{"class":414,"line":1996},[412,3756,3683],{"class":759},[412,3758,3759],{"class":460}," ui-vendor.js",[412,3761,3762],{"class":452}," (80KB)\n",[412,3764,3765,3767,3770],{"class":414,"line":2002},[412,3766,3704],{"class":759},[412,3768,3769],{"class":460}," utils-vendor.js",[412,3771,3772],{"class":452}," (60KB)\n",[330,3774,3776],{"id":3775},"_2-lazy-loading-estratégico","🎯 2. Lazy Loading Estratégico",[353,3778,3780],{"id":3779},"componentes-críticos-vs-não-críticos","Componentes Críticos vs Não-Críticos",[343,3782,3784],{"className":909,"code":3783,"language":911,"meta":351,"style":351},"\u003C!-- components\u002FCriticalComponents.vue -->\n\u003Ctemplate>\n  \u003Cdiv>\n    \u003C!-- Componentes que aparecem acima da dobra -->\n    \u003CHeader \u002F>\n    \u003CHero \u002F>\n    \u003CNavigation \u002F>\n  \u003C\u002Fdiv>\n\u003C\u002Ftemplate>\n\n\u003C!-- components\u002FNonCriticalComponents.vue -->\n\u003Ctemplate>\n  \u003Cdiv>\n    \u003C!-- Componentes que aparecem abaixo da dobra -->\n    \u003CLazyFooter \u002F>\n    \u003CLazyTestimonials \u002F>\n    \u003CLazyNewsletter \u002F>\n  \u003C\u002Fdiv>\n\u003C\u002Ftemplate>\n",[338,3785,3786,3791,3799,3807,3812,3821,3830,3839,3847,3855,3859,3864,3872,3880,3885,3894,3903,3912,3920],{"__ignoreMap":351},[412,3787,3788],{"class":414,"line":415},[412,3789,3790],{"class":418},"\u003C!-- components\u002FCriticalComponents.vue -->\n",[412,3792,3793,3795,3797],{"class":414,"line":422},[412,3794,756],{"class":429},[412,3796,926],{"class":925},[412,3798,929],{"class":429},[412,3800,3801,3803,3805],{"class":414,"line":568},[412,3802,934],{"class":429},[412,3804,937],{"class":925},[412,3806,929],{"class":429},[412,3808,3809],{"class":414,"line":604},[412,3810,3811],{"class":418},"    \u003C!-- Componentes que aparecem acima da dobra -->\n",[412,3813,3814,3816,3819],{"class":414,"line":635},[412,3815,944],{"class":429},[412,3817,3818],{"class":925},"Header",[412,3820,950],{"class":429},[412,3822,3823,3825,3828],{"class":414,"line":797},[412,3824,944],{"class":429},[412,3826,3827],{"class":925},"Hero",[412,3829,950],{"class":429},[412,3831,3832,3834,3837],{"class":414,"line":1566},[412,3833,944],{"class":429},[412,3835,3836],{"class":925},"Navigation",[412,3838,950],{"class":429},[412,3840,3841,3843,3845],{"class":414,"line":1576},[412,3842,955],{"class":429},[412,3844,937],{"class":925},[412,3846,929],{"class":429},[412,3848,3849,3851,3853],{"class":414,"line":1605},[412,3850,964],{"class":429},[412,3852,926],{"class":925},[412,3854,929],{"class":429},[412,3856,3857],{"class":414,"line":1614},[412,3858,1745],{"emptyLinePlaceholder":37},[412,3860,3861],{"class":414,"line":1982},[412,3862,3863],{"class":418},"\u003C!-- components\u002FNonCriticalComponents.vue -->\n",[412,3865,3866,3868,3870],{"class":414,"line":1996},[412,3867,756],{"class":429},[412,3869,926],{"class":925},[412,3871,929],{"class":429},[412,3873,3874,3876,3878],{"class":414,"line":2002},[412,3875,934],{"class":429},[412,3877,937],{"class":925},[412,3879,929],{"class":429},[412,3881,3882],{"class":414,"line":3566},[412,3883,3884],{"class":418},"    \u003C!-- Componentes que aparecem abaixo da dobra -->\n",[412,3886,3887,3889,3892],{"class":414,"line":3600},[412,3888,944],{"class":429},[412,3890,3891],{"class":925},"LazyFooter",[412,3893,950],{"class":429},[412,3895,3896,3898,3901],{"class":414,"line":3632},[412,3897,944],{"class":429},[412,3899,3900],{"class":925},"LazyTestimonials",[412,3902,950],{"class":429},[412,3904,3905,3907,3910],{"class":414,"line":3638},[412,3906,944],{"class":429},[412,3908,3909],{"class":925},"LazyNewsletter",[412,3911,950],{"class":429},[412,3913,3914,3916,3918],{"class":414,"line":3644},[412,3915,955],{"class":429},[412,3917,937],{"class":925},[412,3919,929],{"class":429},[412,3921,3922,3924,3926],{"class":414,"line":3650},[412,3923,964],{"class":429},[412,3925,926],{"class":925},[412,3927,929],{"class":429},[353,3929,3931],{"id":3930},"lazy-loading-com-suspense","Lazy Loading com Suspense",[343,3933,3935],{"className":909,"code":3934,"language":911,"meta":351,"style":351},"\u003Ctemplate>\n  \u003Cdiv>\n    \u003CSuspense>\n      \u003Ctemplate #default>\n        \u003CLazyHeavyComponent \u002F>\n      \u003C\u002Ftemplate>\n      \u003Ctemplate #fallback>\n        \u003Cdiv class=\"skeleton-loader\">\n          \u003C!-- Skeleton loading state -->\n        \u003C\u002Fdiv>\n      \u003C\u002Ftemplate>\n    \u003C\u002FSuspense>\n  \u003C\u002Fdiv>\n\u003C\u002Ftemplate>\n",[338,3936,3937,3945,3953,3962,3976,3986,3995,4008,4027,4032,4041,4049,4057,4065],{"__ignoreMap":351},[412,3938,3939,3941,3943],{"class":414,"line":415},[412,3940,756],{"class":429},[412,3942,926],{"class":925},[412,3944,929],{"class":429},[412,3946,3947,3949,3951],{"class":414,"line":422},[412,3948,934],{"class":429},[412,3950,937],{"class":925},[412,3952,929],{"class":429},[412,3954,3955,3957,3960],{"class":414,"line":568},[412,3956,944],{"class":429},[412,3958,3959],{"class":925},"Suspense",[412,3961,929],{"class":429},[412,3963,3964,3966,3968,3971,3974],{"class":414,"line":604},[412,3965,1505],{"class":429},[412,3967,926],{"class":925},[412,3969,3970],{"class":429}," #",[412,3972,3973],{"class":1454},"default",[412,3975,929],{"class":429},[412,3977,3978,3981,3984],{"class":414,"line":635},[412,3979,3980],{"class":429},"        \u003C",[412,3982,3983],{"class":925},"LazyHeavyComponent",[412,3985,950],{"class":429},[412,3987,3988,3991,3993],{"class":414,"line":797},[412,3989,3990],{"class":429},"      \u003C\u002F",[412,3992,926],{"class":925},[412,3994,929],{"class":429},[412,3996,3997,3999,4001,4003,4006],{"class":414,"line":1566},[412,3998,1505],{"class":429},[412,4000,926],{"class":925},[412,4002,3970],{"class":429},[412,4004,4005],{"class":1454},"fallback",[412,4007,929],{"class":429},[412,4009,4010,4012,4014,4016,4018,4020,4023,4025],{"class":414,"line":1576},[412,4011,3980],{"class":429},[412,4013,937],{"class":925},[412,4015,1455],{"class":1454},[412,4017,1458],{"class":429},[412,4019,1461],{"class":456},[412,4021,4022],{"class":460},"skeleton-loader",[412,4024,1461],{"class":456},[412,4026,929],{"class":429},[412,4028,4029],{"class":414,"line":1605},[412,4030,4031],{"class":418},"          \u003C!-- Skeleton loading state -->\n",[412,4033,4034,4037,4039],{"class":414,"line":1614},[412,4035,4036],{"class":429},"        \u003C\u002F",[412,4038,937],{"class":925},[412,4040,929],{"class":429},[412,4042,4043,4045,4047],{"class":414,"line":1982},[412,4044,3990],{"class":429},[412,4046,926],{"class":925},[412,4048,929],{"class":429},[412,4050,4051,4053,4055],{"class":414,"line":1996},[412,4052,1569],{"class":429},[412,4054,3959],{"class":925},[412,4056,929],{"class":429},[412,4058,4059,4061,4063],{"class":414,"line":2002},[412,4060,955],{"class":429},[412,4062,937],{"class":925},[412,4064,929],{"class":429},[412,4066,4067,4069,4071],{"class":414,"line":3566},[412,4068,964],{"class":429},[412,4070,926],{"class":925},[412,4072,929],{"class":429},[330,4074,4076],{"id":4075},"_3-otimização-de-imagens-avançada","⚡ 3. Otimização de Imagens Avançada",[353,4078,4080],{"id":4079},"sistema-de-imagens-inteligente","Sistema de Imagens Inteligente",[343,4082,4084],{"className":909,"code":4083,"language":911,"meta":351,"style":351},"\u003C!-- components\u002FOptimizedImage.vue -->\n\u003Ctemplate>\n  \u003Cpicture>\n    \u003Csource \n      :srcset=\"webpSrc\" \n      type=\"image\u002Fwebp\"\n    \u002F>\n    \u003Csource \n      :srcset=\"avifSrc\" \n      type=\"image\u002Favif\"\n    \u002F>\n    \u003Cimg\n      :src=\"fallbackSrc\"\n      :alt=\"alt\"\n      :width=\"width\"\n      :height=\"height\"\n      loading=\"lazy\"\n      decoding=\"async\"\n      class=\"optimized-image\"\n    \u002F>\n  \u003C\u002Fpicture>\n\u003C\u002Ftemplate>\n\n\u003Cscript setup>\nconst props = defineProps({\n  src: String,\n  alt: String,\n  width: Number,\n  height: Number\n})\n\n\u002F\u002F Geração automática de múltiplos formatos\nconst webpSrc = computed(() => \n  `\u002Fimages\u002Fwebp\u002F${props.src.replace(\u002F\\.[^\u002F.]+$\u002F, '.webp')}`\n)\nconst avifSrc = computed(() => \n  `\u002Fimages\u002Favif\u002F${props.src.replace(\u002F\\.[^\u002F.]+$\u002F, '.avif')}`\n)\nconst fallbackSrc = computed(() => \n  `\u002Fimages\u002F${props.src}`\n)\n\u003C\u002Fscript>\n",[338,4085,4086,4091,4099,4108,4117,4133,4147,4152,4160,4175,4188,4192,4199,4213,4227,4241,4255,4269,4283,4297,4301,4310,4319,4324,4337,4354,4367,4379,4392,4403,4410,4415,4421,4443,4510,4515,4535,4588,4593,4613,4631,4636],{"__ignoreMap":351},[412,4087,4088],{"class":414,"line":415},[412,4089,4090],{"class":418},"\u003C!-- components\u002FOptimizedImage.vue -->\n",[412,4092,4093,4095,4097],{"class":414,"line":422},[412,4094,756],{"class":429},[412,4096,926],{"class":925},[412,4098,929],{"class":429},[412,4100,4101,4103,4106],{"class":414,"line":568},[412,4102,934],{"class":429},[412,4104,4105],{"class":925},"picture",[412,4107,929],{"class":429},[412,4109,4110,4112,4115],{"class":414,"line":604},[412,4111,944],{"class":429},[412,4113,4114],{"class":925},"source",[412,4116,565],{"class":429},[412,4118,4119,4122,4124,4126,4129,4131],{"class":414,"line":635},[412,4120,4121],{"class":1454},"      :srcset",[412,4123,1458],{"class":429},[412,4125,1461],{"class":456},[412,4127,4128],{"class":460},"webpSrc",[412,4130,1461],{"class":456},[412,4132,565],{"class":429},[412,4134,4135,4138,4140,4142,4145],{"class":414,"line":797},[412,4136,4137],{"class":1454},"      type",[412,4139,1458],{"class":429},[412,4141,1461],{"class":456},[412,4143,4144],{"class":460},"image\u002Fwebp",[412,4146,2291],{"class":456},[412,4148,4149],{"class":414,"line":1566},[412,4150,4151],{"class":429},"    \u002F>\n",[412,4153,4154,4156,4158],{"class":414,"line":1576},[412,4155,944],{"class":429},[412,4157,4114],{"class":925},[412,4159,565],{"class":429},[412,4161,4162,4164,4166,4168,4171,4173],{"class":414,"line":1605},[412,4163,4121],{"class":1454},[412,4165,1458],{"class":429},[412,4167,1461],{"class":456},[412,4169,4170],{"class":460},"avifSrc",[412,4172,1461],{"class":456},[412,4174,565],{"class":429},[412,4176,4177,4179,4181,4183,4186],{"class":414,"line":1614},[412,4178,4137],{"class":1454},[412,4180,1458],{"class":429},[412,4182,1461],{"class":456},[412,4184,4185],{"class":460},"image\u002Favif",[412,4187,2291],{"class":456},[412,4189,4190],{"class":414,"line":1982},[412,4191,4151],{"class":429},[412,4193,4194,4196],{"class":414,"line":1996},[412,4195,944],{"class":429},[412,4197,4198],{"class":925},"img\n",[412,4200,4201,4204,4206,4208,4211],{"class":414,"line":2002},[412,4202,4203],{"class":1454},"      :src",[412,4205,1458],{"class":429},[412,4207,1461],{"class":456},[412,4209,4210],{"class":460},"fallbackSrc",[412,4212,2291],{"class":456},[412,4214,4215,4218,4220,4222,4225],{"class":414,"line":3566},[412,4216,4217],{"class":1454},"      :alt",[412,4219,1458],{"class":429},[412,4221,1461],{"class":456},[412,4223,4224],{"class":460},"alt",[412,4226,2291],{"class":456},[412,4228,4229,4232,4234,4236,4239],{"class":414,"line":3600},[412,4230,4231],{"class":1454},"      :width",[412,4233,1458],{"class":429},[412,4235,1461],{"class":456},[412,4237,4238],{"class":460},"width",[412,4240,2291],{"class":456},[412,4242,4243,4246,4248,4250,4253],{"class":414,"line":3632},[412,4244,4245],{"class":1454},"      :height",[412,4247,1458],{"class":429},[412,4249,1461],{"class":456},[412,4251,4252],{"class":460},"height",[412,4254,2291],{"class":456},[412,4256,4257,4260,4262,4264,4267],{"class":414,"line":3638},[412,4258,4259],{"class":1454},"      loading",[412,4261,1458],{"class":429},[412,4263,1461],{"class":456},[412,4265,4266],{"class":460},"lazy",[412,4268,2291],{"class":456},[412,4270,4271,4274,4276,4278,4281],{"class":414,"line":3644},[412,4272,4273],{"class":1454},"      decoding",[412,4275,1458],{"class":429},[412,4277,1461],{"class":456},[412,4279,4280],{"class":460},"async",[412,4282,2291],{"class":456},[412,4284,4285,4288,4290,4292,4295],{"class":414,"line":3650},[412,4286,4287],{"class":1454},"      class",[412,4289,1458],{"class":429},[412,4291,1461],{"class":456},[412,4293,4294],{"class":460},"optimized-image",[412,4296,2291],{"class":456},[412,4298,4299],{"class":414,"line":3655},[412,4300,4151],{"class":429},[412,4302,4304,4306,4308],{"class":414,"line":4303},21,[412,4305,955],{"class":429},[412,4307,4105],{"class":925},[412,4309,929],{"class":429},[412,4311,4313,4315,4317],{"class":414,"line":4312},22,[412,4314,964],{"class":429},[412,4316,926],{"class":925},[412,4318,929],{"class":429},[412,4320,4322],{"class":414,"line":4321},23,[412,4323,1745],{"emptyLinePlaceholder":37},[412,4325,4327,4329,4332,4335],{"class":414,"line":4326},24,[412,4328,756],{"class":429},[412,4330,4331],{"class":925},"script",[412,4333,4334],{"class":1454}," setup",[412,4336,929],{"class":429},[412,4338,4340,4342,4345,4347,4350,4352],{"class":414,"line":4339},25,[412,4341,426],{"class":425},[412,4343,4344],{"class":433}," props",[412,4346,441],{"class":440},[412,4348,4349],{"class":448}," defineProps",[412,4351,453],{"class":452},[412,4353,2363],{"class":429},[412,4355,4357,4360,4362,4365],{"class":414,"line":4356},26,[412,4358,4359],{"class":610},"  src",[412,4361,399],{"class":429},[412,4363,4364],{"class":452}," String",[412,4366,1900],{"class":429},[412,4368,4370,4373,4375,4377],{"class":414,"line":4369},27,[412,4371,4372],{"class":610},"  alt",[412,4374,399],{"class":429},[412,4376,4364],{"class":452},[412,4378,1900],{"class":429},[412,4380,4382,4385,4387,4390],{"class":414,"line":4381},28,[412,4383,4384],{"class":610},"  width",[412,4386,399],{"class":429},[412,4388,4389],{"class":452}," Number",[412,4391,1900],{"class":429},[412,4393,4395,4398,4400],{"class":414,"line":4394},29,[412,4396,4397],{"class":610},"  height",[412,4399,399],{"class":429},[412,4401,4402],{"class":452}," Number\n",[412,4404,4406,4408],{"class":414,"line":4405},30,[412,4407,2388],{"class":429},[412,4409,638],{"class":452},[412,4411,4413],{"class":414,"line":4412},31,[412,4414,1745],{"emptyLinePlaceholder":37},[412,4416,4418],{"class":414,"line":4417},32,[412,4419,4420],{"class":418},"\u002F\u002F Geração automática de múltiplos formatos\n",[412,4422,4424,4426,4429,4431,4434,4436,4439,4441],{"class":414,"line":4423},33,[412,4425,426],{"class":425},[412,4427,4428],{"class":433}," webpSrc",[412,4430,441],{"class":440},[412,4432,4433],{"class":448}," computed",[412,4435,453],{"class":452},[412,4437,4438],{"class":429},"()",[412,4440,472],{"class":425},[412,4442,565],{"class":452},[412,4444,4446,4449,4452,4454,4457,4459,4462,4464,4467,4470,4473,4477,4480,4483,4486,4488,4491,4494,4496,4498,4500,4503,4505,4507],{"class":414,"line":4445},34,[412,4447,4448],{"class":456},"  `",[412,4450,4451],{"class":460},"\u002Fimages\u002Fwebp\u002F",[412,4453,582],{"class":456},[412,4455,4456],{"class":452},"props",[412,4458,588],{"class":456},[412,4460,4461],{"class":452},"src",[412,4463,588],{"class":456},[412,4465,4466],{"class":448},"replace",[412,4468,453],{"class":4469},"sfo-9",[412,4471,4472],{"class":456},"\u002F",[412,4474,4476],{"class":4475},"sjYin","\\.",[412,4478,4479],{"class":775},"[",[412,4481,4482],{"class":440},"^",[412,4484,4485],{"class":1037},"\u002F.",[412,4487,3529],{"class":775},[412,4489,4490],{"class":440},"+",[412,4492,4493],{"class":444},"$",[412,4495,4472],{"class":456},[412,4497,466],{"class":456},[412,4499,1892],{"class":456},[412,4501,4502],{"class":460},".webp",[412,4504,457],{"class":456},[412,4506,597],{"class":4469},[412,4508,4509],{"class":456},"}`\n",[412,4511,4513],{"class":414,"line":4512},35,[412,4514,638],{"class":452},[412,4516,4518,4520,4523,4525,4527,4529,4531,4533],{"class":414,"line":4517},36,[412,4519,426],{"class":425},[412,4521,4522],{"class":433}," avifSrc",[412,4524,441],{"class":440},[412,4526,4433],{"class":448},[412,4528,453],{"class":452},[412,4530,4438],{"class":429},[412,4532,472],{"class":425},[412,4534,565],{"class":452},[412,4536,4538,4540,4543,4545,4547,4549,4551,4553,4555,4557,4559,4561,4563,4565,4567,4569,4571,4573,4575,4577,4579,4582,4584,4586],{"class":414,"line":4537},37,[412,4539,4448],{"class":456},[412,4541,4542],{"class":460},"\u002Fimages\u002Favif\u002F",[412,4544,582],{"class":456},[412,4546,4456],{"class":452},[412,4548,588],{"class":456},[412,4550,4461],{"class":452},[412,4552,588],{"class":456},[412,4554,4466],{"class":448},[412,4556,453],{"class":4469},[412,4558,4472],{"class":456},[412,4560,4476],{"class":4475},[412,4562,4479],{"class":775},[412,4564,4482],{"class":440},[412,4566,4485],{"class":1037},[412,4568,3529],{"class":775},[412,4570,4490],{"class":440},[412,4572,4493],{"class":444},[412,4574,4472],{"class":456},[412,4576,466],{"class":456},[412,4578,1892],{"class":456},[412,4580,4581],{"class":460},".avif",[412,4583,457],{"class":456},[412,4585,597],{"class":4469},[412,4587,4509],{"class":456},[412,4589,4591],{"class":414,"line":4590},38,[412,4592,638],{"class":452},[412,4594,4596,4598,4601,4603,4605,4607,4609,4611],{"class":414,"line":4595},39,[412,4597,426],{"class":425},[412,4599,4600],{"class":433}," fallbackSrc",[412,4602,441],{"class":440},[412,4604,4433],{"class":448},[412,4606,453],{"class":452},[412,4608,4438],{"class":429},[412,4610,472],{"class":425},[412,4612,565],{"class":452},[412,4614,4616,4618,4621,4623,4625,4627,4629],{"class":414,"line":4615},40,[412,4617,4448],{"class":456},[412,4619,4620],{"class":460},"\u002Fimages\u002F",[412,4622,582],{"class":456},[412,4624,4456],{"class":452},[412,4626,588],{"class":456},[412,4628,4461],{"class":452},[412,4630,4509],{"class":456},[412,4632,4634],{"class":414,"line":4633},41,[412,4635,638],{"class":452},[412,4637,4639,4641,4643],{"class":414,"line":4638},42,[412,4640,964],{"class":429},[412,4642,4331],{"class":925},[412,4644,929],{"class":429},[353,4646,4648],{"id":4647},"resultado-mensurável","Resultado Mensurável",[343,4650,4652],{"className":406,"code":4651,"language":408,"meta":351,"style":351},"\u002F\u002F Antes: 2.3MB de imagens\n\u002F\u002F Depois: 680KB de imagens (-70%)\nconst imageOptimization = {\n  webp: '30% smaller than JPEG',\n  avif: '50% smaller than JPEG', \n  lazy: 'Load only visible images',\n  responsive: 'Multiple sizes for different screens'\n}\n",[338,4653,4654,4659,4664,4675,4691,4709,4725,4739],{"__ignoreMap":351},[412,4655,4656],{"class":414,"line":415},[412,4657,4658],{"class":418},"\u002F\u002F Antes: 2.3MB de imagens\n",[412,4660,4661],{"class":414,"line":422},[412,4662,4663],{"class":418},"\u002F\u002F Depois: 680KB de imagens (-70%)\n",[412,4665,4666,4668,4671,4673],{"class":414,"line":568},[412,4667,426],{"class":425},[412,4669,4670],{"class":433}," imageOptimization",[412,4672,441],{"class":440},[412,4674,741],{"class":429},[412,4676,4677,4680,4682,4684,4687,4689],{"class":414,"line":604},[412,4678,4679],{"class":610},"  webp",[412,4681,399],{"class":429},[412,4683,1892],{"class":456},[412,4685,4686],{"class":460},"30% smaller than JPEG",[412,4688,457],{"class":456},[412,4690,1900],{"class":429},[412,4692,4693,4696,4698,4700,4703,4705,4707],{"class":414,"line":635},[412,4694,4695],{"class":610},"  avif",[412,4697,399],{"class":429},[412,4699,1892],{"class":456},[412,4701,4702],{"class":460},"50% smaller than JPEG",[412,4704,457],{"class":456},[412,4706,466],{"class":429},[412,4708,565],{"class":452},[412,4710,4711,4714,4716,4718,4721,4723],{"class":414,"line":797},[412,4712,4713],{"class":610},"  lazy",[412,4715,399],{"class":429},[412,4717,1892],{"class":456},[412,4719,4720],{"class":460},"Load only visible images",[412,4722,457],{"class":456},[412,4724,1900],{"class":429},[412,4726,4727,4730,4732,4734,4737],{"class":414,"line":1566},[412,4728,4729],{"class":610},"  responsive",[412,4731,399],{"class":429},[412,4733,1892],{"class":456},[412,4735,4736],{"class":460},"Multiple sizes for different screens",[412,4738,1931],{"class":456},[412,4740,4741],{"class":414,"line":1576},[412,4742,800],{"class":429},[330,4744,4746],{"id":4745},"_4-cache-strategy-inteligente","🔧 4. Cache Strategy Inteligente",[353,4748,4750],{"id":4749},"cache-em-múltiplas-camadas","Cache em Múltiplas Camadas",[343,4752,4754],{"className":406,"code":4753,"language":408,"meta":351,"style":351},"\u002F\u002F server\u002Fapi\u002Fcached-data.ts\nexport default defineCachedEventHandler(async (event) => {\n  const data = await $fetch('\u002Fexternal-api\u002Fdata')\n  \n  return {\n    data,\n    cached: true,\n    timestamp: Date.now()\n  }\n}, {\n  maxAge: 60 * 60 * 24, \u002F\u002F 24 horas\n  swr: true, \u002F\u002F Stale-While-Revalidate\n  getKey: (event) => `cached-data-${event.context.params.id}`\n})\n",[338,4755,4756,4761,4785,4808,4812,4818,4825,4837,4855,4859,4866,4891,4905,4946],{"__ignoreMap":351},[412,4757,4758],{"class":414,"line":415},[412,4759,4760],{"class":418},"\u002F\u002F server\u002Fapi\u002Fcached-data.ts\n",[412,4762,4763,4765,4767,4770,4772,4774,4776,4779,4781,4783],{"class":414,"line":422},[412,4764,725],{"class":444},[412,4766,2355],{"class":444},[412,4768,4769],{"class":448}," defineCachedEventHandler",[412,4771,453],{"class":452},[412,4773,4280],{"class":425},[412,4775,657],{"class":429},[412,4777,4778],{"class":1753},"event",[412,4780,597],{"class":429},[412,4782,472],{"class":425},[412,4784,741],{"class":429},[412,4786,4787,4789,4791,4793,4795,4797,4799,4801,4804,4806],{"class":414,"line":568},[412,4788,746],{"class":425},[412,4790,434],{"class":433},[412,4792,441],{"class":440},[412,4794,445],{"class":444},[412,4796,475],{"class":448},[412,4798,453],{"class":610},[412,4800,457],{"class":456},[412,4802,4803],{"class":460},"\u002Fexternal-api\u002Fdata",[412,4805,457],{"class":456},[412,4807,638],{"class":610},[412,4809,4810],{"class":414,"line":604},[412,4811,3456],{"class":610},[412,4813,4814,4816],{"class":414,"line":635},[412,4815,788],{"class":444},[412,4817,741],{"class":429},[412,4819,4820,4823],{"class":414,"line":797},[412,4821,4822],{"class":452},"    data",[412,4824,1900],{"class":429},[412,4826,4827,4830,4832,4835],{"class":414,"line":1566},[412,4828,4829],{"class":610},"    cached",[412,4831,399],{"class":429},[412,4833,4834],{"class":2306}," true",[412,4836,1900],{"class":429},[412,4838,4839,4842,4844,4847,4849,4852],{"class":414,"line":1576},[412,4840,4841],{"class":610},"    timestamp",[412,4843,399],{"class":429},[412,4845,4846],{"class":452}," Date",[412,4848,588],{"class":429},[412,4850,4851],{"class":448},"now",[412,4853,4854],{"class":610},"()\n",[412,4856,4857],{"class":414,"line":1605},[412,4858,1999],{"class":429},[412,4860,4861,4864],{"class":414,"line":1614},[412,4862,4863],{"class":429},"},",[412,4865,741],{"class":429},[412,4867,4868,4871,4873,4876,4879,4881,4883,4886,4888],{"class":414,"line":1982},[412,4869,4870],{"class":610},"  maxAge",[412,4872,399],{"class":429},[412,4874,4875],{"class":1670}," 60",[412,4877,4878],{"class":440}," *",[412,4880,4875],{"class":1670},[412,4882,4878],{"class":440},[412,4884,4885],{"class":1670}," 24",[412,4887,466],{"class":429},[412,4889,4890],{"class":418}," \u002F\u002F 24 horas\n",[412,4892,4893,4896,4898,4900,4902],{"class":414,"line":1996},[412,4894,4895],{"class":610},"  swr",[412,4897,399],{"class":429},[412,4899,4834],{"class":2306},[412,4901,466],{"class":429},[412,4903,4904],{"class":418}," \u002F\u002F Stale-While-Revalidate\n",[412,4906,4907,4910,4912,4914,4916,4918,4920,4922,4925,4927,4929,4931,4934,4936,4939,4941,4944],{"class":414,"line":2002},[412,4908,4909],{"class":448},"  getKey",[412,4911,399],{"class":429},[412,4913,657],{"class":429},[412,4915,4778],{"class":1753},[412,4917,597],{"class":429},[412,4919,472],{"class":425},[412,4921,616],{"class":456},[412,4923,4924],{"class":460},"cached-data-",[412,4926,582],{"class":456},[412,4928,4778],{"class":452},[412,4930,588],{"class":456},[412,4932,4933],{"class":452},"context",[412,4935,588],{"class":456},[412,4937,4938],{"class":452},"params",[412,4940,588],{"class":456},[412,4942,4943],{"class":452},"id",[412,4945,4509],{"class":456},[412,4947,4948,4950],{"class":414,"line":3566},[412,4949,2388],{"class":429},[412,4951,638],{"class":452},[353,4953,4955],{"id":4954},"cache-de-componentes","Cache de Componentes",[343,4957,4959],{"className":909,"code":4958,"language":911,"meta":351,"style":351},"\u003C!-- components\u002FCachedComponent.vue -->\n\u003Ctemplate>\n  \u003Cdiv v-if=\"data\">\n    {{ data }}\n  \u003C\u002Fdiv>\n  \u003Cdiv v-else>\n    Loading...\n  \u003C\u002Fdiv>\n\u003C\u002Ftemplate>\n\n\u003Cscript setup>\n\u002F\u002F Cache automático por 1 hora\nconst { data } = await useFetch('\u002Fapi\u002Fexpensive-data', {\n  key: 'expensive-data',\n  default: () => null,\n  server: false, \u002F\u002F Client-side apenas\n  transform: (data) => data.result\n})\n\u003C\u002Fscript>\n",[338,4960,4961,4966,4974,4994,4999,5007,5018,5023,5031,5039,5043,5053,5058,5088,5104,5119,5134,5155,5161],{"__ignoreMap":351},[412,4962,4963],{"class":414,"line":415},[412,4964,4965],{"class":418},"\u003C!-- components\u002FCachedComponent.vue -->\n",[412,4967,4968,4970,4972],{"class":414,"line":422},[412,4969,756],{"class":429},[412,4971,926],{"class":925},[412,4973,929],{"class":429},[412,4975,4976,4978,4980,4983,4985,4987,4990,4992],{"class":414,"line":568},[412,4977,934],{"class":429},[412,4979,937],{"class":925},[412,4981,4982],{"class":1454}," v-if",[412,4984,1458],{"class":429},[412,4986,1461],{"class":456},[412,4988,4989],{"class":460},"data",[412,4991,1461],{"class":456},[412,4993,929],{"class":429},[412,4995,4996],{"class":414,"line":604},[412,4997,4998],{"class":452},"    {{ data }}\n",[412,5000,5001,5003,5005],{"class":414,"line":635},[412,5002,955],{"class":429},[412,5004,937],{"class":925},[412,5006,929],{"class":429},[412,5008,5009,5011,5013,5016],{"class":414,"line":797},[412,5010,934],{"class":429},[412,5012,937],{"class":925},[412,5014,5015],{"class":1454}," v-else",[412,5017,929],{"class":429},[412,5019,5020],{"class":414,"line":1566},[412,5021,5022],{"class":452},"    Loading...\n",[412,5024,5025,5027,5029],{"class":414,"line":1576},[412,5026,955],{"class":429},[412,5028,937],{"class":925},[412,5030,929],{"class":429},[412,5032,5033,5035,5037],{"class":414,"line":1605},[412,5034,964],{"class":429},[412,5036,926],{"class":925},[412,5038,929],{"class":429},[412,5040,5041],{"class":414,"line":1614},[412,5042,1745],{"emptyLinePlaceholder":37},[412,5044,5045,5047,5049,5051],{"class":414,"line":1982},[412,5046,756],{"class":429},[412,5048,4331],{"class":925},[412,5050,4334],{"class":1454},[412,5052,929],{"class":429},[412,5054,5055],{"class":414,"line":1996},[412,5056,5057],{"class":418},"\u002F\u002F Cache automático por 1 hora\n",[412,5059,5060,5062,5064,5066,5068,5070,5072,5075,5077,5079,5082,5084,5086],{"class":414,"line":2002},[412,5061,426],{"class":425},[412,5063,430],{"class":429},[412,5065,434],{"class":433},[412,5067,437],{"class":429},[412,5069,441],{"class":440},[412,5071,445],{"class":444},[412,5073,5074],{"class":448}," useFetch",[412,5076,453],{"class":452},[412,5078,457],{"class":456},[412,5080,5081],{"class":460},"\u002Fapi\u002Fexpensive-data",[412,5083,457],{"class":456},[412,5085,466],{"class":429},[412,5087,741],{"class":429},[412,5089,5090,5093,5095,5097,5100,5102],{"class":414,"line":3566},[412,5091,5092],{"class":610},"  key",[412,5094,399],{"class":429},[412,5096,1892],{"class":456},[412,5098,5099],{"class":460},"expensive-data",[412,5101,457],{"class":456},[412,5103,1900],{"class":429},[412,5105,5106,5109,5111,5113,5115,5117],{"class":414,"line":3600},[412,5107,5108],{"class":448},"  default",[412,5110,399],{"class":429},[412,5112,469],{"class":429},[412,5114,472],{"class":425},[412,5116,767],{"class":775},[412,5118,1900],{"class":429},[412,5120,5121,5124,5126,5129,5131],{"class":414,"line":3632},[412,5122,5123],{"class":610},"  server",[412,5125,399],{"class":429},[412,5127,5128],{"class":2306}," false",[412,5130,466],{"class":429},[412,5132,5133],{"class":418}," \u002F\u002F Client-side apenas\n",[412,5135,5136,5138,5140,5142,5144,5146,5148,5150,5152],{"class":414,"line":3638},[412,5137,2089],{"class":448},[412,5139,399],{"class":429},[412,5141,657],{"class":429},[412,5143,4989],{"class":1753},[412,5145,597],{"class":429},[412,5147,472],{"class":425},[412,5149,434],{"class":452},[412,5151,588],{"class":429},[412,5153,5154],{"class":452},"result\n",[412,5156,5157,5159],{"class":414,"line":3644},[412,5158,2388],{"class":429},[412,5160,638],{"class":452},[412,5162,5163,5165,5167],{"class":414,"line":3650},[412,5164,964],{"class":429},[412,5166,4331],{"class":925},[412,5168,929],{"class":429},[330,5170,5172],{"id":5171},"_5-pwa-e-service-worker-otimizado","📱 5. PWA e Service Worker Otimizado",[353,5174,5176],{"id":5175},"service-worker-inteligente","Service Worker Inteligente",[343,5178,5180],{"className":406,"code":5179,"language":408,"meta":351,"style":351},"\u002F\u002F public\u002Fsw.js\nconst CACHE_NAME = 'nuxt-app-v1'\nconst STATIC_ASSETS = [\n  '\u002F',\n  '\u002Fmanifest.json',\n  '\u002Ffavicon.ico'\n]\n\n\u002F\u002F Cache estratégico\nself.addEventListener('fetch', (event) => {\n  if (event.request.destination === 'image') {\n    event.respondWith(\n      caches.match(event.request).then(response => {\n        return response || fetch(event.request).then(fetchResponse => {\n          return caches.open(CACHE_NAME).then(cache => {\n            cache.put(event.request, fetchResponse.clone())\n            return fetchResponse\n          })\n        })\n      })\n    )\n  }\n})\n",[338,5181,5182,5187,5203,5214,5224,5235,5244,5248,5252,5257,5288,5321,5334,5368,5405,5438,5469,5477,5484,5491,5498,5503,5507],{"__ignoreMap":351},[412,5183,5184],{"class":414,"line":415},[412,5185,5186],{"class":418},"\u002F\u002F public\u002Fsw.js\n",[412,5188,5189,5191,5194,5196,5198,5201],{"class":414,"line":422},[412,5190,426],{"class":425},[412,5192,5193],{"class":433}," CACHE_NAME",[412,5195,441],{"class":440},[412,5197,1892],{"class":456},[412,5199,5200],{"class":460},"nuxt-app-v1",[412,5202,1931],{"class":456},[412,5204,5205,5207,5210,5212],{"class":414,"line":568},[412,5206,426],{"class":425},[412,5208,5209],{"class":433}," STATIC_ASSETS",[412,5211,441],{"class":440},[412,5213,2448],{"class":452},[412,5215,5216,5218,5220,5222],{"class":414,"line":604},[412,5217,1872],{"class":456},[412,5219,4472],{"class":460},[412,5221,457],{"class":456},[412,5223,1900],{"class":429},[412,5225,5226,5228,5231,5233],{"class":414,"line":635},[412,5227,1872],{"class":456},[412,5229,5230],{"class":460},"\u002Fmanifest.json",[412,5232,457],{"class":456},[412,5234,1900],{"class":429},[412,5236,5237,5239,5242],{"class":414,"line":797},[412,5238,1872],{"class":456},[412,5240,5241],{"class":460},"\u002Ffavicon.ico",[412,5243,1931],{"class":456},[412,5245,5246],{"class":414,"line":1566},[412,5247,2383],{"class":452},[412,5249,5250],{"class":414,"line":1576},[412,5251,1745],{"emptyLinePlaceholder":37},[412,5253,5254],{"class":414,"line":1605},[412,5255,5256],{"class":418},"\u002F\u002F Cache estratégico\n",[412,5258,5259,5262,5264,5267,5269,5271,5274,5276,5278,5280,5282,5284,5286],{"class":414,"line":1614},[412,5260,5261],{"class":452},"self",[412,5263,588],{"class":429},[412,5265,5266],{"class":448},"addEventListener",[412,5268,453],{"class":452},[412,5270,457],{"class":456},[412,5272,5273],{"class":460},"fetch",[412,5275,457],{"class":456},[412,5277,466],{"class":429},[412,5279,657],{"class":429},[412,5281,4778],{"class":1753},[412,5283,597],{"class":429},[412,5285,472],{"class":425},[412,5287,741],{"class":429},[412,5289,5290,5293,5295,5297,5299,5302,5304,5307,5309,5311,5314,5316,5319],{"class":414,"line":1982},[412,5291,5292],{"class":444},"  if",[412,5294,657],{"class":610},[412,5296,4778],{"class":452},[412,5298,588],{"class":429},[412,5300,5301],{"class":452},"request",[412,5303,588],{"class":429},[412,5305,5306],{"class":452},"destination",[412,5308,3441],{"class":440},[412,5310,1892],{"class":456},[412,5312,5313],{"class":460},"image",[412,5315,457],{"class":456},[412,5317,5318],{"class":610},") ",[412,5320,2363],{"class":429},[412,5322,5323,5326,5328,5331],{"class":414,"line":1996},[412,5324,5325],{"class":452},"    event",[412,5327,588],{"class":429},[412,5329,5330],{"class":448},"respondWith",[412,5332,5333],{"class":610},"(\n",[412,5335,5336,5339,5341,5344,5346,5348,5350,5352,5354,5356,5359,5361,5364,5366],{"class":414,"line":2002},[412,5337,5338],{"class":452},"      caches",[412,5340,588],{"class":429},[412,5342,5343],{"class":448},"match",[412,5345,453],{"class":610},[412,5347,4778],{"class":452},[412,5349,588],{"class":429},[412,5351,5301],{"class":452},[412,5353,597],{"class":610},[412,5355,588],{"class":429},[412,5357,5358],{"class":448},"then",[412,5360,453],{"class":610},[412,5362,5363],{"class":1753},"response",[412,5365,472],{"class":425},[412,5367,741],{"class":429},[412,5369,5370,5373,5376,5379,5382,5384,5386,5388,5390,5392,5394,5396,5398,5401,5403],{"class":414,"line":3566},[412,5371,5372],{"class":444},"        return",[412,5374,5375],{"class":452}," response",[412,5377,5378],{"class":440}," ||",[412,5380,5381],{"class":448}," fetch",[412,5383,453],{"class":610},[412,5385,4778],{"class":452},[412,5387,588],{"class":429},[412,5389,5301],{"class":452},[412,5391,597],{"class":610},[412,5393,588],{"class":429},[412,5395,5358],{"class":448},[412,5397,453],{"class":610},[412,5399,5400],{"class":1753},"fetchResponse",[412,5402,472],{"class":425},[412,5404,741],{"class":429},[412,5406,5407,5410,5413,5415,5418,5420,5423,5425,5427,5429,5431,5434,5436],{"class":414,"line":3600},[412,5408,5409],{"class":444},"          return",[412,5411,5412],{"class":452}," caches",[412,5414,588],{"class":429},[412,5416,5417],{"class":448},"open",[412,5419,453],{"class":610},[412,5421,5422],{"class":433},"CACHE_NAME",[412,5424,597],{"class":610},[412,5426,588],{"class":429},[412,5428,5358],{"class":448},[412,5430,453],{"class":610},[412,5432,5433],{"class":1753},"cache",[412,5435,472],{"class":425},[412,5437,741],{"class":429},[412,5439,5440,5443,5445,5448,5450,5452,5454,5456,5458,5461,5463,5466],{"class":414,"line":3632},[412,5441,5442],{"class":452},"            cache",[412,5444,588],{"class":429},[412,5446,5447],{"class":448},"put",[412,5449,453],{"class":610},[412,5451,4778],{"class":452},[412,5453,588],{"class":429},[412,5455,5301],{"class":452},[412,5457,466],{"class":429},[412,5459,5460],{"class":452}," fetchResponse",[412,5462,588],{"class":429},[412,5464,5465],{"class":448},"clone",[412,5467,5468],{"class":610},"())\n",[412,5470,5471,5474],{"class":414,"line":3638},[412,5472,5473],{"class":444},"            return",[412,5475,5476],{"class":452}," fetchResponse\n",[412,5478,5479,5482],{"class":414,"line":3644},[412,5480,5481],{"class":429},"          }",[412,5483,638],{"class":610},[412,5485,5486,5489],{"class":414,"line":3650},[412,5487,5488],{"class":429},"        }",[412,5490,638],{"class":610},[412,5492,5493,5496],{"class":414,"line":3655},[412,5494,5495],{"class":429},"      }",[412,5497,638],{"class":610},[412,5499,5500],{"class":414,"line":4303},[412,5501,5502],{"class":610},"    )\n",[412,5504,5505],{"class":414,"line":4312},[412,5506,1999],{"class":429},[412,5508,5509,5511],{"class":414,"line":4321},[412,5510,2388],{"class":429},[412,5512,638],{"class":452},[353,5514,5516],{"id":5515},"resultado-pwa","Resultado PWA",[343,5518,5522],{"className":5519,"code":5520,"language":5521,"meta":351,"style":351},"language-json shiki shiki-themes material-theme-lighter github-light github-dark","\u002F\u002F Lighthouse PWA Score: 95+\n{\n  \"installable\": true,\n  \"offline\": true,\n  \"fast\": true,\n  \"responsive\": true\n}\n","json",[338,5523,5524,5529,5533,5549,5564,5579,5593],{"__ignoreMap":351},[412,5525,5526],{"class":414,"line":415},[412,5527,5528],{"class":418},"\u002F\u002F Lighthouse PWA Score: 95+\n",[412,5530,5531],{"class":414,"line":422},[412,5532,2363],{"class":429},[412,5534,5535,5537,5541,5543,5545,5547],{"class":414,"line":568},[412,5536,2840],{"class":775},[412,5538,5540],{"class":5539},"sseR_","installable",[412,5542,1461],{"class":775},[412,5544,399],{"class":429},[412,5546,4834],{"class":775},[412,5548,1900],{"class":429},[412,5550,5551,5553,5556,5558,5560,5562],{"class":414,"line":604},[412,5552,2840],{"class":775},[412,5554,5555],{"class":5539},"offline",[412,5557,1461],{"class":775},[412,5559,399],{"class":429},[412,5561,4834],{"class":775},[412,5563,1900],{"class":429},[412,5565,5566,5568,5571,5573,5575,5577],{"class":414,"line":635},[412,5567,2840],{"class":775},[412,5569,5570],{"class":5539},"fast",[412,5572,1461],{"class":775},[412,5574,399],{"class":429},[412,5576,4834],{"class":775},[412,5578,1900],{"class":429},[412,5580,5581,5583,5586,5588,5590],{"class":414,"line":797},[412,5582,2840],{"class":775},[412,5584,5585],{"class":5539},"responsive",[412,5587,1461],{"class":775},[412,5589,399],{"class":429},[412,5591,5592],{"class":775}," true\n",[412,5594,5595],{"class":414,"line":1566},[412,5596,800],{"class":429},[330,5598,5600],{"id":5599},"_6-css-e-styling-otimizado","🎨 6. CSS e Styling Otimizado",[353,5602,5604],{"id":5603},"critical-css-inline","Critical CSS Inline",[343,5606,5608],{"className":909,"code":5607,"language":911,"meta":351,"style":351},"\u003C!-- layouts\u002Fdefault.vue -->\n\u003Ctemplate>\n  \u003CHtml>\n    \u003CHead>\n      \u003C!-- Critical CSS inline -->\n      \u003Cstyle v-html=\"criticalCSS\">\u003C\u002Fstyle>\n    \u003C\u002FHead>\n    \u003CBody>\n      \u003CNuxtPage \u002F>\n    \u003C\u002FBody>\n  \u003C\u002FHtml>\n\u003C\u002Ftemplate>\n\n\u003Cscript setup>\n\u002F\u002F Critical CSS para above-the-fold\nconst criticalCSS = `\n  .header { \u002F* estilos críticos *\u002F }\n  .hero { \u002F* estilos críticos *\u002F }\n  .navigation { \u002F* estilos críticos *\u002F }\n`\n\u003C\u002Fscript>\n",[338,5609,5610,5615,5623,5632,5641,5646,5671,5679,5688,5697,5705,5713,5721,5725,5735,5740,5752,5757,5762,5767,5772],{"__ignoreMap":351},[412,5611,5612],{"class":414,"line":415},[412,5613,5614],{"class":418},"\u003C!-- layouts\u002Fdefault.vue -->\n",[412,5616,5617,5619,5621],{"class":414,"line":422},[412,5618,756],{"class":429},[412,5620,926],{"class":925},[412,5622,929],{"class":429},[412,5624,5625,5627,5630],{"class":414,"line":568},[412,5626,934],{"class":429},[412,5628,5629],{"class":925},"Html",[412,5631,929],{"class":429},[412,5633,5634,5636,5639],{"class":414,"line":604},[412,5635,944],{"class":429},[412,5637,5638],{"class":925},"Head",[412,5640,929],{"class":429},[412,5642,5643],{"class":414,"line":635},[412,5644,5645],{"class":418},"      \u003C!-- Critical CSS inline -->\n",[412,5647,5648,5650,5652,5655,5657,5659,5662,5664,5667,5669],{"class":414,"line":797},[412,5649,1505],{"class":429},[412,5651,1246],{"class":925},[412,5653,5654],{"class":1454}," v-html",[412,5656,1458],{"class":429},[412,5658,1461],{"class":456},[412,5660,5661],{"class":460},"criticalCSS",[412,5663,1461],{"class":456},[412,5665,5666],{"class":429},">\u003C\u002F",[412,5668,1246],{"class":925},[412,5670,929],{"class":429},[412,5672,5673,5675,5677],{"class":414,"line":1566},[412,5674,1569],{"class":429},[412,5676,5638],{"class":925},[412,5678,929],{"class":429},[412,5680,5681,5683,5686],{"class":414,"line":1576},[412,5682,944],{"class":429},[412,5684,5685],{"class":925},"Body",[412,5687,929],{"class":429},[412,5689,5690,5692,5695],{"class":414,"line":1605},[412,5691,1505],{"class":429},[412,5693,5694],{"class":925},"NuxtPage",[412,5696,950],{"class":429},[412,5698,5699,5701,5703],{"class":414,"line":1614},[412,5700,1569],{"class":429},[412,5702,5685],{"class":925},[412,5704,929],{"class":429},[412,5706,5707,5709,5711],{"class":414,"line":1982},[412,5708,955],{"class":429},[412,5710,5629],{"class":925},[412,5712,929],{"class":429},[412,5714,5715,5717,5719],{"class":414,"line":1996},[412,5716,964],{"class":429},[412,5718,926],{"class":925},[412,5720,929],{"class":429},[412,5722,5723],{"class":414,"line":2002},[412,5724,1745],{"emptyLinePlaceholder":37},[412,5726,5727,5729,5731,5733],{"class":414,"line":3566},[412,5728,756],{"class":429},[412,5730,4331],{"class":925},[412,5732,4334],{"class":1454},[412,5734,929],{"class":429},[412,5736,5737],{"class":414,"line":3600},[412,5738,5739],{"class":418},"\u002F\u002F Critical CSS para above-the-fold\n",[412,5741,5742,5744,5747,5749],{"class":414,"line":3632},[412,5743,426],{"class":425},[412,5745,5746],{"class":433}," criticalCSS",[412,5748,441],{"class":440},[412,5750,5751],{"class":456}," `\n",[412,5753,5754],{"class":414,"line":3638},[412,5755,5756],{"class":460},"  .header { \u002F* estilos críticos *\u002F }\n",[412,5758,5759],{"class":414,"line":3644},[412,5760,5761],{"class":460},"  .hero { \u002F* estilos críticos *\u002F }\n",[412,5763,5764],{"class":414,"line":3650},[412,5765,5766],{"class":460},"  .navigation { \u002F* estilos críticos *\u002F }\n",[412,5768,5769],{"class":414,"line":3655},[412,5770,5771],{"class":456},"`\n",[412,5773,5774,5776,5778],{"class":414,"line":4303},[412,5775,964],{"class":429},[412,5777,4331],{"class":925},[412,5779,929],{"class":429},[353,5781,5783],{"id":5782},"css-purging-inteligente","CSS Purging Inteligente",[343,5785,5787],{"className":406,"code":5786,"language":408,"meta":351,"style":351},"\u002F\u002F nuxt.config.ts\nexport default defineNuxtConfig({\n  css: ['~\u002Fassets\u002Fcss\u002Fmain.css'],\n  \n  postcss: {\n    plugins: {\n      tailwindcss: {},\n      autoprefixer: {},\n      cssnano: {\n        preset: ['default', {\n          discardComments: { removeAll: true },\n          normalizeWhitespace: true\n        }]\n      }\n    }\n  }\n})\n",[338,5788,5789,5793,5805,5825,5829,5838,5847,5857,5866,5875,5894,5913,5922,5928,5932,5936,5940],{"__ignoreMap":351},[412,5790,5791],{"class":414,"line":415},[412,5792,2348],{"class":418},[412,5794,5795,5797,5799,5801,5803],{"class":414,"line":422},[412,5796,725],{"class":444},[412,5798,2355],{"class":444},[412,5800,2358],{"class":448},[412,5802,453],{"class":452},[412,5804,2363],{"class":429},[412,5806,5807,5810,5812,5814,5816,5819,5821,5823],{"class":414,"line":568},[412,5808,5809],{"class":610},"  css",[412,5811,399],{"class":429},[412,5813,2373],{"class":452},[412,5815,457],{"class":456},[412,5817,5818],{"class":460},"~\u002Fassets\u002Fcss\u002Fmain.css",[412,5820,457],{"class":456},[412,5822,3529],{"class":452},[412,5824,1900],{"class":429},[412,5826,5827],{"class":414,"line":604},[412,5828,3456],{"class":452},[412,5830,5831,5834,5836],{"class":414,"line":635},[412,5832,5833],{"class":610},"  postcss",[412,5835,399],{"class":429},[412,5837,741],{"class":429},[412,5839,5840,5843,5845],{"class":414,"line":797},[412,5841,5842],{"class":610},"    plugins",[412,5844,399],{"class":429},[412,5846,741],{"class":429},[412,5848,5849,5852,5854],{"class":414,"line":1566},[412,5850,5851],{"class":610},"      tailwindcss",[412,5853,399],{"class":429},[412,5855,5856],{"class":429}," {},\n",[412,5858,5859,5862,5864],{"class":414,"line":1576},[412,5860,5861],{"class":610},"      autoprefixer",[412,5863,399],{"class":429},[412,5865,5856],{"class":429},[412,5867,5868,5871,5873],{"class":414,"line":1605},[412,5869,5870],{"class":610},"      cssnano",[412,5872,399],{"class":429},[412,5874,741],{"class":429},[412,5876,5877,5880,5882,5884,5886,5888,5890,5892],{"class":414,"line":1614},[412,5878,5879],{"class":610},"        preset",[412,5881,399],{"class":429},[412,5883,2373],{"class":452},[412,5885,457],{"class":456},[412,5887,3973],{"class":460},[412,5889,457],{"class":456},[412,5891,466],{"class":429},[412,5893,741],{"class":429},[412,5895,5896,5899,5901,5903,5906,5908,5910],{"class":414,"line":1982},[412,5897,5898],{"class":610},"          discardComments",[412,5900,399],{"class":429},[412,5902,430],{"class":429},[412,5904,5905],{"class":610}," removeAll",[412,5907,399],{"class":429},[412,5909,4834],{"class":2306},[412,5911,5912],{"class":429}," },\n",[412,5914,5915,5918,5920],{"class":414,"line":1996},[412,5916,5917],{"class":610},"          normalizeWhitespace",[412,5919,399],{"class":429},[412,5921,5592],{"class":2306},[412,5923,5924,5926],{"class":414,"line":2002},[412,5925,5488],{"class":429},[412,5927,2383],{"class":452},[412,5929,5930],{"class":414,"line":3566},[412,5931,3641],{"class":429},[412,5933,5934],{"class":414,"line":3600},[412,5935,3647],{"class":429},[412,5937,5938],{"class":414,"line":3632},[412,5939,1999],{"class":429},[412,5941,5942,5944],{"class":414,"line":3638},[412,5943,2388],{"class":429},[412,5945,638],{"class":452},[330,5947,5949],{"id":5948},"_7-monitoring-e-analytics","🔍 7. Monitoring e Analytics",[353,5951,5953],{"id":5952},"web-vitals-tracking","Web Vitals Tracking",[343,5955,5957],{"className":406,"code":5956,"language":408,"meta":351,"style":351},"\u002F\u002F plugins\u002Fweb-vitals.client.ts\nexport default defineNuxtPlugin(() => {\n  if (process.client) {\n    import('web-vitals').then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => {\n      getCLS(console.log)\n      getFID(console.log)\n      getFCP(console.log)\n      getLCP(console.log)\n      getTTFB(console.log)\n    })\n  }\n})\n",[338,5958,5959,5964,5981,5999,6054,6071,6086,6101,6116,6131,6138,6142],{"__ignoreMap":351},[412,5960,5961],{"class":414,"line":415},[412,5962,5963],{"class":418},"\u002F\u002F plugins\u002Fweb-vitals.client.ts\n",[412,5965,5966,5968,5970,5973,5975,5977,5979],{"class":414,"line":422},[412,5967,725],{"class":444},[412,5969,2355],{"class":444},[412,5971,5972],{"class":448}," defineNuxtPlugin",[412,5974,453],{"class":452},[412,5976,4438],{"class":429},[412,5978,472],{"class":425},[412,5980,741],{"class":429},[412,5982,5983,5985,5987,5990,5992,5995,5997],{"class":414,"line":568},[412,5984,5292],{"class":444},[412,5986,657],{"class":610},[412,5988,5989],{"class":452},"process",[412,5991,588],{"class":429},[412,5993,5994],{"class":452},"client",[412,5996,5318],{"class":610},[412,5998,2363],{"class":429},[412,6000,6001,6004,6006,6008,6011,6013,6015,6017,6019,6021,6024,6027,6029,6032,6034,6037,6039,6042,6044,6047,6050,6052],{"class":414,"line":604},[412,6002,6003],{"class":440},"    import",[412,6005,453],{"class":610},[412,6007,457],{"class":456},[412,6009,6010],{"class":460},"web-vitals",[412,6012,457],{"class":456},[412,6014,597],{"class":610},[412,6016,588],{"class":429},[412,6018,5358],{"class":448},[412,6020,453],{"class":610},[412,6022,6023],{"class":429},"({",[412,6025,6026],{"class":1753}," getCLS",[412,6028,466],{"class":429},[412,6030,6031],{"class":1753}," getFID",[412,6033,466],{"class":429},[412,6035,6036],{"class":1753}," getFCP",[412,6038,466],{"class":429},[412,6040,6041],{"class":1753}," getLCP",[412,6043,466],{"class":429},[412,6045,6046],{"class":1753}," getTTFB",[412,6048,6049],{"class":429}," })",[412,6051,472],{"class":425},[412,6053,741],{"class":429},[412,6055,6056,6059,6061,6064,6066,6069],{"class":414,"line":635},[412,6057,6058],{"class":448},"      getCLS",[412,6060,453],{"class":610},[412,6062,6063],{"class":452},"console",[412,6065,588],{"class":429},[412,6067,6068],{"class":452},"log",[412,6070,638],{"class":610},[412,6072,6073,6076,6078,6080,6082,6084],{"class":414,"line":797},[412,6074,6075],{"class":448},"      getFID",[412,6077,453],{"class":610},[412,6079,6063],{"class":452},[412,6081,588],{"class":429},[412,6083,6068],{"class":452},[412,6085,638],{"class":610},[412,6087,6088,6091,6093,6095,6097,6099],{"class":414,"line":1566},[412,6089,6090],{"class":448},"      getFCP",[412,6092,453],{"class":610},[412,6094,6063],{"class":452},[412,6096,588],{"class":429},[412,6098,6068],{"class":452},[412,6100,638],{"class":610},[412,6102,6103,6106,6108,6110,6112,6114],{"class":414,"line":1576},[412,6104,6105],{"class":448},"      getLCP",[412,6107,453],{"class":610},[412,6109,6063],{"class":452},[412,6111,588],{"class":429},[412,6113,6068],{"class":452},[412,6115,638],{"class":610},[412,6117,6118,6121,6123,6125,6127,6129],{"class":414,"line":1605},[412,6119,6120],{"class":448},"      getTTFB",[412,6122,453],{"class":610},[412,6124,6063],{"class":452},[412,6126,588],{"class":429},[412,6128,6068],{"class":452},[412,6130,638],{"class":610},[412,6132,6133,6136],{"class":414,"line":1614},[412,6134,6135],{"class":429},"    }",[412,6137,638],{"class":610},[412,6139,6140],{"class":414,"line":1982},[412,6141,1999],{"class":429},[412,6143,6144,6146],{"class":414,"line":1996},[412,6145,2388],{"class":429},[412,6147,638],{"class":452},[353,6149,6151],{"id":6150},"performance-budget","Performance Budget",[343,6153,6155],{"className":406,"code":6154,"language":408,"meta":351,"style":351},"\u002F\u002F nuxt.config.ts\nexport default defineNuxtConfig({\n  nitro: {\n    experimental: {\n      wasm: true\n    }\n  },\n  \n  \u002F\u002F Performance budget\n  build: {\n    analyze: {\n      analyzerMode: 'static',\n      openAnalyzer: false,\n      generateStatsFile: true\n    }\n  }\n})\n",[338,6156,6157,6161,6173,6181,6190,6199,6203,6207,6211,6216,6224,6232,6248,6259,6268,6272,6276],{"__ignoreMap":351},[412,6158,6159],{"class":414,"line":415},[412,6160,2348],{"class":418},[412,6162,6163,6165,6167,6169,6171],{"class":414,"line":422},[412,6164,725],{"class":444},[412,6166,2355],{"class":444},[412,6168,2358],{"class":448},[412,6170,453],{"class":452},[412,6172,2363],{"class":429},[412,6174,6175,6177,6179],{"class":414,"line":568},[412,6176,3461],{"class":610},[412,6178,399],{"class":429},[412,6180,741],{"class":429},[412,6182,6183,6186,6188],{"class":414,"line":604},[412,6184,6185],{"class":610},"    experimental",[412,6187,399],{"class":429},[412,6189,741],{"class":429},[412,6191,6192,6195,6197],{"class":414,"line":635},[412,6193,6194],{"class":610},"      wasm",[412,6196,399],{"class":429},[412,6198,5592],{"class":2306},[412,6200,6201],{"class":414,"line":797},[412,6202,3647],{"class":429},[412,6204,6205],{"class":414,"line":1566},[412,6206,1936],{"class":429},[412,6208,6209],{"class":414,"line":1576},[412,6210,3456],{"class":452},[412,6212,6213],{"class":414,"line":1605},[412,6214,6215],{"class":418},"  \u002F\u002F Performance budget\n",[412,6217,6218,6220,6222],{"class":414,"line":1614},[412,6219,3414],{"class":610},[412,6221,399],{"class":429},[412,6223,741],{"class":429},[412,6225,6226,6228,6230],{"class":414,"line":1982},[412,6227,3423],{"class":610},[412,6229,399],{"class":429},[412,6231,741],{"class":429},[412,6233,6234,6237,6239,6241,6244,6246],{"class":414,"line":1996},[412,6235,6236],{"class":610},"      analyzerMode",[412,6238,399],{"class":429},[412,6240,1892],{"class":456},[412,6242,6243],{"class":460},"static",[412,6245,457],{"class":456},[412,6247,1900],{"class":429},[412,6249,6250,6253,6255,6257],{"class":414,"line":2002},[412,6251,6252],{"class":610},"      openAnalyzer",[412,6254,399],{"class":429},[412,6256,5128],{"class":2306},[412,6258,1900],{"class":429},[412,6260,6261,6264,6266],{"class":414,"line":3566},[412,6262,6263],{"class":610},"      generateStatsFile",[412,6265,399],{"class":429},[412,6267,5592],{"class":2306},[412,6269,6270],{"class":414,"line":3600},[412,6271,3647],{"class":429},[412,6273,6274],{"class":414,"line":3632},[412,6275,1999],{"class":429},[412,6277,6278,6280],{"class":414,"line":3638},[412,6279,2388],{"class":429},[412,6281,638],{"class":452},[330,6283,6285],{"id":6284},"_8-resultados-mensuráveis","📈 8. Resultados Mensuráveis",[353,6287,6289],{"id":6288},"lighthouse-scores","Lighthouse Scores",[343,6291,6293],{"className":406,"code":6292,"language":408,"meta":351,"style":351},"const lighthouseResults = {\n  performance: {\n    before: 72,\n    after: 94,\n    improvement: '+22 pontos'\n  },\n  accessibility: {\n    before: 85,\n    after: 98,\n    improvement: '+13 pontos'\n  },\n  bestPractices: {\n    before: 78,\n    after: 95,\n    improvement: '+17 pontos'\n  },\n  seo: {\n    before: 88,\n    after: 100,\n    improvement: '+12 pontos'\n  }\n}\n",[338,6294,6295,6306,6315,6327,6339,6353,6357,6366,6377,6388,6401,6405,6414,6425,6436,6449,6453,6462,6473,6484,6497,6501],{"__ignoreMap":351},[412,6296,6297,6299,6302,6304],{"class":414,"line":415},[412,6298,426],{"class":425},[412,6300,6301],{"class":433}," lighthouseResults",[412,6303,441],{"class":440},[412,6305,741],{"class":429},[412,6307,6308,6311,6313],{"class":414,"line":422},[412,6309,6310],{"class":610},"  performance",[412,6312,399],{"class":429},[412,6314,741],{"class":429},[412,6316,6317,6320,6322,6325],{"class":414,"line":568},[412,6318,6319],{"class":610},"    before",[412,6321,399],{"class":429},[412,6323,6324],{"class":1670}," 72",[412,6326,1900],{"class":429},[412,6328,6329,6332,6334,6337],{"class":414,"line":604},[412,6330,6331],{"class":610},"    after",[412,6333,399],{"class":429},[412,6335,6336],{"class":1670}," 94",[412,6338,1900],{"class":429},[412,6340,6341,6344,6346,6348,6351],{"class":414,"line":635},[412,6342,6343],{"class":610},"    improvement",[412,6345,399],{"class":429},[412,6347,1892],{"class":456},[412,6349,6350],{"class":460},"+22 pontos",[412,6352,1931],{"class":456},[412,6354,6355],{"class":414,"line":797},[412,6356,1936],{"class":429},[412,6358,6359,6362,6364],{"class":414,"line":1566},[412,6360,6361],{"class":610},"  accessibility",[412,6363,399],{"class":429},[412,6365,741],{"class":429},[412,6367,6368,6370,6372,6375],{"class":414,"line":1576},[412,6369,6319],{"class":610},[412,6371,399],{"class":429},[412,6373,6374],{"class":1670}," 85",[412,6376,1900],{"class":429},[412,6378,6379,6381,6383,6386],{"class":414,"line":1605},[412,6380,6331],{"class":610},[412,6382,399],{"class":429},[412,6384,6385],{"class":1670}," 98",[412,6387,1900],{"class":429},[412,6389,6390,6392,6394,6396,6399],{"class":414,"line":1614},[412,6391,6343],{"class":610},[412,6393,399],{"class":429},[412,6395,1892],{"class":456},[412,6397,6398],{"class":460},"+13 pontos",[412,6400,1931],{"class":456},[412,6402,6403],{"class":414,"line":1982},[412,6404,1936],{"class":429},[412,6406,6407,6410,6412],{"class":414,"line":1996},[412,6408,6409],{"class":610},"  bestPractices",[412,6411,399],{"class":429},[412,6413,741],{"class":429},[412,6415,6416,6418,6420,6423],{"class":414,"line":2002},[412,6417,6319],{"class":610},[412,6419,399],{"class":429},[412,6421,6422],{"class":1670}," 78",[412,6424,1900],{"class":429},[412,6426,6427,6429,6431,6434],{"class":414,"line":3566},[412,6428,6331],{"class":610},[412,6430,399],{"class":429},[412,6432,6433],{"class":1670}," 95",[412,6435,1900],{"class":429},[412,6437,6438,6440,6442,6444,6447],{"class":414,"line":3600},[412,6439,6343],{"class":610},[412,6441,399],{"class":429},[412,6443,1892],{"class":456},[412,6445,6446],{"class":460},"+17 pontos",[412,6448,1931],{"class":456},[412,6450,6451],{"class":414,"line":3632},[412,6452,1936],{"class":429},[412,6454,6455,6458,6460],{"class":414,"line":3638},[412,6456,6457],{"class":610},"  seo",[412,6459,399],{"class":429},[412,6461,741],{"class":429},[412,6463,6464,6466,6468,6471],{"class":414,"line":3644},[412,6465,6319],{"class":610},[412,6467,399],{"class":429},[412,6469,6470],{"class":1670}," 88",[412,6472,1900],{"class":429},[412,6474,6475,6477,6479,6482],{"class":414,"line":3650},[412,6476,6331],{"class":610},[412,6478,399],{"class":429},[412,6480,6481],{"class":1670}," 100",[412,6483,1900],{"class":429},[412,6485,6486,6488,6490,6492,6495],{"class":414,"line":3655},[412,6487,6343],{"class":610},[412,6489,399],{"class":429},[412,6491,1892],{"class":456},[412,6493,6494],{"class":460},"+12 pontos",[412,6496,1931],{"class":456},[412,6498,6499],{"class":414,"line":4303},[412,6500,1999],{"class":429},[412,6502,6503],{"class":414,"line":4312},[412,6504,800],{"class":429},[353,6506,6508],{"id":6507},"core-web-vitals","Core Web Vitals",[343,6510,6512],{"className":406,"code":6511,"language":408,"meta":351,"style":351},"const coreWebVitals = {\n  LCP: {\n    before: '3.8s',\n    after: '2.1s',\n    improvement: '-45%'\n  },\n  FID: {\n    before: '120ms',\n    after: '45ms',\n    improvement: '-63%'\n  },\n  CLS: {\n    before: '0.15',\n    after: '0.02',\n    improvement: '-87%'\n  }\n}\n",[338,6513,6514,6525,6534,6549,6564,6577,6581,6590,6605,6620,6633,6637,6646,6660,6675,6688,6692],{"__ignoreMap":351},[412,6515,6516,6518,6521,6523],{"class":414,"line":415},[412,6517,426],{"class":425},[412,6519,6520],{"class":433}," coreWebVitals",[412,6522,441],{"class":440},[412,6524,741],{"class":429},[412,6526,6527,6530,6532],{"class":414,"line":422},[412,6528,6529],{"class":610},"  LCP",[412,6531,399],{"class":429},[412,6533,741],{"class":429},[412,6535,6536,6538,6540,6542,6545,6547],{"class":414,"line":568},[412,6537,6319],{"class":610},[412,6539,399],{"class":429},[412,6541,1892],{"class":456},[412,6543,6544],{"class":460},"3.8s",[412,6546,457],{"class":456},[412,6548,1900],{"class":429},[412,6550,6551,6553,6555,6557,6560,6562],{"class":414,"line":604},[412,6552,6331],{"class":610},[412,6554,399],{"class":429},[412,6556,1892],{"class":456},[412,6558,6559],{"class":460},"2.1s",[412,6561,457],{"class":456},[412,6563,1900],{"class":429},[412,6565,6566,6568,6570,6572,6575],{"class":414,"line":635},[412,6567,6343],{"class":610},[412,6569,399],{"class":429},[412,6571,1892],{"class":456},[412,6573,6574],{"class":460},"-45%",[412,6576,1931],{"class":456},[412,6578,6579],{"class":414,"line":797},[412,6580,1936],{"class":429},[412,6582,6583,6586,6588],{"class":414,"line":1566},[412,6584,6585],{"class":610},"  FID",[412,6587,399],{"class":429},[412,6589,741],{"class":429},[412,6591,6592,6594,6596,6598,6601,6603],{"class":414,"line":1576},[412,6593,6319],{"class":610},[412,6595,399],{"class":429},[412,6597,1892],{"class":456},[412,6599,6600],{"class":460},"120ms",[412,6602,457],{"class":456},[412,6604,1900],{"class":429},[412,6606,6607,6609,6611,6613,6616,6618],{"class":414,"line":1605},[412,6608,6331],{"class":610},[412,6610,399],{"class":429},[412,6612,1892],{"class":456},[412,6614,6615],{"class":460},"45ms",[412,6617,457],{"class":456},[412,6619,1900],{"class":429},[412,6621,6622,6624,6626,6628,6631],{"class":414,"line":1614},[412,6623,6343],{"class":610},[412,6625,399],{"class":429},[412,6627,1892],{"class":456},[412,6629,6630],{"class":460},"-63%",[412,6632,1931],{"class":456},[412,6634,6635],{"class":414,"line":1982},[412,6636,1936],{"class":429},[412,6638,6639,6642,6644],{"class":414,"line":1996},[412,6640,6641],{"class":610},"  CLS",[412,6643,399],{"class":429},[412,6645,741],{"class":429},[412,6647,6648,6650,6652,6654,6656,6658],{"class":414,"line":2002},[412,6649,6319],{"class":610},[412,6651,399],{"class":429},[412,6653,1892],{"class":456},[412,6655,2156],{"class":460},[412,6657,457],{"class":456},[412,6659,1900],{"class":429},[412,6661,6662,6664,6666,6668,6671,6673],{"class":414,"line":3566},[412,6663,6331],{"class":610},[412,6665,399],{"class":429},[412,6667,1892],{"class":456},[412,6669,6670],{"class":460},"0.02",[412,6672,457],{"class":456},[412,6674,1900],{"class":429},[412,6676,6677,6679,6681,6683,6686],{"class":414,"line":3600},[412,6678,6343],{"class":610},[412,6680,399],{"class":429},[412,6682,1892],{"class":456},[412,6684,6685],{"class":460},"-87%",[412,6687,1931],{"class":456},[412,6689,6690],{"class":414,"line":3632},[412,6691,1999],{"class":429},[412,6693,6694],{"class":414,"line":3638},[412,6695,800],{"class":429},[330,6697,6699],{"id":6698},"️-9-ferramentas-de-monitoramento","🛠️ 9. Ferramentas de Monitoramento",[353,6701,6703],{"id":6702},"bundle-analyzer","Bundle Analyzer",[343,6705,6707],{"className":1019,"code":6706,"language":1021,"meta":351,"style":351},"# Análise detalhada do bundle\nnpm run build:analyze\n\n# Resultado: gráfico interativo mostrando:\n# - Tamanho de cada chunk\n# - Dependências duplicadas\n# - Oportunidades de otimização\n",[338,6708,6709,6714,6725,6729,6734,6739,6744],{"__ignoreMap":351},[412,6710,6711],{"class":414,"line":415},[412,6712,6713],{"class":418},"# Análise detalhada do bundle\n",[412,6715,6716,6719,6722],{"class":414,"line":422},[412,6717,6718],{"class":759},"npm",[412,6720,6721],{"class":460}," run",[412,6723,6724],{"class":460}," build:analyze\n",[412,6726,6727],{"class":414,"line":568},[412,6728,1745],{"emptyLinePlaceholder":37},[412,6730,6731],{"class":414,"line":604},[412,6732,6733],{"class":418},"# Resultado: gráfico interativo mostrando:\n",[412,6735,6736],{"class":414,"line":635},[412,6737,6738],{"class":418},"# - Tamanho de cada chunk\n",[412,6740,6741],{"class":414,"line":797},[412,6742,6743],{"class":418},"# - Dependências duplicadas\n",[412,6745,6746],{"class":414,"line":1566},[412,6747,6748],{"class":418},"# - Oportunidades de otimização\n",[353,6750,6752],{"id":6751},"performance-monitoring","Performance Monitoring",[343,6754,6756],{"className":406,"code":6755,"language":408,"meta":351,"style":351},"\u002F\u002F utils\u002Fperformance.ts\nexport const measurePerformance = (name: string, fn: () => void) => {\n  const start = performance.now()\n  fn()\n  const end = performance.now()\n  \n  console.log(`${name}: ${end - start}ms`)\n  \n  \u002F\u002F Enviar para analytics\n  if (process.client) {\n    gtag('event', 'performance', {\n      event_category: 'timing',\n      event_label: name,\n      value: Math.round(end - start)\n    })\n  }\n}\n",[338,6757,6758,6763,6804,6822,6829,6846,6850,6890,6894,6899,6915,6940,6956,6968,6993,6999,7003],{"__ignoreMap":351},[412,6759,6760],{"class":414,"line":415},[412,6761,6762],{"class":418},"\u002F\u002F utils\u002Fperformance.ts\n",[412,6764,6765,6767,6769,6772,6774,6776,6779,6781,6784,6786,6789,6791,6793,6795,6798,6800,6802],{"class":414,"line":422},[412,6766,725],{"class":444},[412,6768,728],{"class":425},[412,6770,6771],{"class":731}," measurePerformance",[412,6773,441],{"class":440},[412,6775,657],{"class":429},[412,6777,6778],{"class":1753},"name",[412,6780,399],{"class":440},[412,6782,6783],{"class":766}," string",[412,6785,466],{"class":429},[412,6787,6788],{"class":448}," fn",[412,6790,399],{"class":440},[412,6792,469],{"class":429},[412,6794,472],{"class":425},[412,6796,6797],{"class":766}," void",[412,6799,597],{"class":429},[412,6801,472],{"class":425},[412,6803,741],{"class":429},[412,6805,6806,6808,6811,6813,6816,6818,6820],{"class":414,"line":568},[412,6807,746],{"class":425},[412,6809,6810],{"class":433}," start",[412,6812,441],{"class":440},[412,6814,6815],{"class":452}," performance",[412,6817,588],{"class":429},[412,6819,4851],{"class":448},[412,6821,4854],{"class":610},[412,6823,6824,6827],{"class":414,"line":604},[412,6825,6826],{"class":448},"  fn",[412,6828,4854],{"class":610},[412,6830,6831,6833,6836,6838,6840,6842,6844],{"class":414,"line":635},[412,6832,746],{"class":425},[412,6834,6835],{"class":433}," end",[412,6837,441],{"class":440},[412,6839,6815],{"class":452},[412,6841,588],{"class":429},[412,6843,4851],{"class":448},[412,6845,4854],{"class":610},[412,6847,6848],{"class":414,"line":797},[412,6849,3456],{"class":610},[412,6851,6852,6855,6857,6859,6861,6864,6866,6868,6871,6873,6876,6879,6881,6883,6886,6888],{"class":414,"line":1566},[412,6853,6854],{"class":452},"  console",[412,6856,588],{"class":429},[412,6858,6068],{"class":448},[412,6860,453],{"class":610},[412,6862,6863],{"class":456},"`${",[412,6865,6778],{"class":452},[412,6867,2388],{"class":456},[412,6869,6870],{"class":460},": ",[412,6872,582],{"class":456},[412,6874,6875],{"class":452},"end",[412,6877,6878],{"class":440}," -",[412,6880,6810],{"class":452},[412,6882,2388],{"class":456},[412,6884,6885],{"class":460},"ms",[412,6887,576],{"class":456},[412,6889,638],{"class":610},[412,6891,6892],{"class":414,"line":1576},[412,6893,3456],{"class":610},[412,6895,6896],{"class":414,"line":1605},[412,6897,6898],{"class":418},"  \u002F\u002F Enviar para analytics\n",[412,6900,6901,6903,6905,6907,6909,6911,6913],{"class":414,"line":1614},[412,6902,5292],{"class":444},[412,6904,657],{"class":610},[412,6906,5989],{"class":452},[412,6908,588],{"class":429},[412,6910,5994],{"class":452},[412,6912,5318],{"class":610},[412,6914,2363],{"class":429},[412,6916,6917,6920,6922,6924,6926,6928,6930,6932,6934,6936,6938],{"class":414,"line":1982},[412,6918,6919],{"class":448},"    gtag",[412,6921,453],{"class":610},[412,6923,457],{"class":456},[412,6925,4778],{"class":460},[412,6927,457],{"class":456},[412,6929,466],{"class":429},[412,6931,1892],{"class":456},[412,6933,1305],{"class":460},[412,6935,457],{"class":456},[412,6937,466],{"class":429},[412,6939,741],{"class":429},[412,6941,6942,6945,6947,6949,6952,6954],{"class":414,"line":1996},[412,6943,6944],{"class":610},"      event_category",[412,6946,399],{"class":429},[412,6948,1892],{"class":456},[412,6950,6951],{"class":460},"timing",[412,6953,457],{"class":456},[412,6955,1900],{"class":429},[412,6957,6958,6961,6963,6966],{"class":414,"line":2002},[412,6959,6960],{"class":610},"      event_label",[412,6962,399],{"class":429},[412,6964,6965],{"class":452}," name",[412,6967,1900],{"class":429},[412,6969,6970,6973,6975,6978,6980,6983,6985,6987,6989,6991],{"class":414,"line":3566},[412,6971,6972],{"class":610},"      value",[412,6974,399],{"class":429},[412,6976,6977],{"class":452}," Math",[412,6979,588],{"class":429},[412,6981,6982],{"class":448},"round",[412,6984,453],{"class":610},[412,6986,6875],{"class":452},[412,6988,6878],{"class":440},[412,6990,6810],{"class":452},[412,6992,638],{"class":610},[412,6994,6995,6997],{"class":414,"line":3600},[412,6996,6135],{"class":429},[412,6998,638],{"class":610},[412,7000,7001],{"class":414,"line":3632},[412,7002,1999],{"class":429},[412,7004,7005],{"class":414,"line":3638},[412,7006,800],{"class":429},[330,7008,7010],{"id":7009},"_10-checklist-de-otimização","🎯 10. Checklist de Otimização",[353,7012,7014],{"id":7013},"checklist-completo","✅ Checklist Completo",[343,7016,7018],{"className":3113,"code":7017,"language":3115,"meta":351,"style":351},"## Bundle Optimization\n- [ ] Code splitting implementado\n- [ ] Tree shaking ativo\n- [ ] Bundle analyzer configurado\n- [ ] Dependências duplicadas removidas\n\n## Image Optimization  \n- [ ] WebP\u002FAVIF implementado\n- [ ] Lazy loading ativo\n- [ ] Responsive images\n- [ ] Sizes otimizados\n\n## Caching Strategy\n- [ ] Service Worker configurado\n- [ ] Cache headers otimizados\n- [ ] CDN configurado\n- [ ] Cache invalidation\n\n## Performance Monitoring\n- [ ] Web Vitals tracking\n- [ ] Performance budget\n- [ ] Real User Monitoring\n- [ ] Lighthouse CI\n",[338,7019,7020,7025,7030,7035,7040,7045,7049,7054,7059,7064,7069,7074,7078,7083,7088,7093,7098,7103,7107,7112,7117,7122,7127],{"__ignoreMap":351},[412,7021,7022],{"class":414,"line":415},[412,7023,7024],{},"## Bundle Optimization\n",[412,7026,7027],{"class":414,"line":422},[412,7028,7029],{},"- [ ] Code splitting implementado\n",[412,7031,7032],{"class":414,"line":568},[412,7033,7034],{},"- [ ] Tree shaking ativo\n",[412,7036,7037],{"class":414,"line":604},[412,7038,7039],{},"- [ ] Bundle analyzer configurado\n",[412,7041,7042],{"class":414,"line":635},[412,7043,7044],{},"- [ ] Dependências duplicadas removidas\n",[412,7046,7047],{"class":414,"line":797},[412,7048,1745],{"emptyLinePlaceholder":37},[412,7050,7051],{"class":414,"line":1566},[412,7052,7053],{},"## Image Optimization  \n",[412,7055,7056],{"class":414,"line":1576},[412,7057,7058],{},"- [ ] WebP\u002FAVIF implementado\n",[412,7060,7061],{"class":414,"line":1605},[412,7062,7063],{},"- [ ] Lazy loading ativo\n",[412,7065,7066],{"class":414,"line":1614},[412,7067,7068],{},"- [ ] Responsive images\n",[412,7070,7071],{"class":414,"line":1982},[412,7072,7073],{},"- [ ] Sizes otimizados\n",[412,7075,7076],{"class":414,"line":1996},[412,7077,1745],{"emptyLinePlaceholder":37},[412,7079,7080],{"class":414,"line":2002},[412,7081,7082],{},"## Caching Strategy\n",[412,7084,7085],{"class":414,"line":3566},[412,7086,7087],{},"- [ ] Service Worker configurado\n",[412,7089,7090],{"class":414,"line":3600},[412,7091,7092],{},"- [ ] Cache headers otimizados\n",[412,7094,7095],{"class":414,"line":3632},[412,7096,7097],{},"- [ ] CDN configurado\n",[412,7099,7100],{"class":414,"line":3638},[412,7101,7102],{},"- [ ] Cache invalidation\n",[412,7104,7105],{"class":414,"line":3644},[412,7106,1745],{"emptyLinePlaceholder":37},[412,7108,7109],{"class":414,"line":3650},[412,7110,7111],{},"## Performance Monitoring\n",[412,7113,7114],{"class":414,"line":3655},[412,7115,7116],{},"- [ ] Web Vitals tracking\n",[412,7118,7119],{"class":414,"line":4303},[412,7120,7121],{},"- [ ] Performance budget\n",[412,7123,7124],{"class":414,"line":4312},[412,7125,7126],{},"- [ ] Real User Monitoring\n",[412,7128,7129],{"class":414,"line":4321},[412,7130,7131],{},"- [ ] Lighthouse CI\n",[330,7133,7135],{"id":7134},"implementação-prática","🚀 Implementação Prática",[353,7137,7139],{"id":7138},"passo-a-passo","Passo a Passo",[343,7141,7143],{"className":1019,"code":7142,"language":1021,"meta":351,"style":351},"# 1. Análise inicial\nnpm run build:analyze\n\n# 2. Implementar otimizações\n# (seguir checklist acima)\n\n# 3. Medir resultados\nnpm run lighthouse\n\n# 4. Monitorar em produção\n# (configurar analytics)\n",[338,7144,7145,7150,7158,7162,7167,7172,7176,7181,7190,7194,7199],{"__ignoreMap":351},[412,7146,7147],{"class":414,"line":415},[412,7148,7149],{"class":418},"# 1. Análise inicial\n",[412,7151,7152,7154,7156],{"class":414,"line":422},[412,7153,6718],{"class":759},[412,7155,6721],{"class":460},[412,7157,6724],{"class":460},[412,7159,7160],{"class":414,"line":568},[412,7161,1745],{"emptyLinePlaceholder":37},[412,7163,7164],{"class":414,"line":604},[412,7165,7166],{"class":418},"# 2. Implementar otimizações\n",[412,7168,7169],{"class":414,"line":635},[412,7170,7171],{"class":418},"# (seguir checklist acima)\n",[412,7173,7174],{"class":414,"line":797},[412,7175,1745],{"emptyLinePlaceholder":37},[412,7177,7178],{"class":414,"line":1566},[412,7179,7180],{"class":418},"# 3. Medir resultados\n",[412,7182,7183,7185,7187],{"class":414,"line":1576},[412,7184,6718],{"class":759},[412,7186,6721],{"class":460},[412,7188,7189],{"class":460}," lighthouse\n",[412,7191,7192],{"class":414,"line":1605},[412,7193,1745],{"emptyLinePlaceholder":37},[412,7195,7196],{"class":414,"line":1614},[412,7197,7198],{"class":418},"# 4. Monitorar em produção\n",[412,7200,7201],{"class":414,"line":1982},[412,7202,7203],{"class":418},"# (configurar analytics)\n",[330,7205,7207],{"id":7206},"lições-aprendidas","💡 Lições Aprendidas",[353,7209,7211],{"id":7210},"_1-performance-é-processo","1. Performance é Processo",[321,7213,7214,7215,7218],{},"Não é uma tarefa única - é um ",[325,7216,7217],{},"processo contínuo"," de monitoramento e otimização.",[353,7220,7222],{"id":7221},"_2-medir-é-fundamental","2. Medir é Fundamental",[343,7224,7226],{"className":406,"code":7225,"language":408,"meta":351,"style":351},"\u002F\u002F Sempre meça antes e depois\nconst beforeOptimization = await measurePerformance()\n\u002F\u002F ... implementar otimizações ...\nconst afterOptimization = await measurePerformance()\n\nconsole.log(`Improvement: ${((before - after) \u002F before * 100).toFixed(1)}%`)\n",[338,7227,7228,7233,7248,7253,7268,7272],{"__ignoreMap":351},[412,7229,7230],{"class":414,"line":415},[412,7231,7232],{"class":418},"\u002F\u002F Sempre meça antes e depois\n",[412,7234,7235,7237,7240,7242,7244,7246],{"class":414,"line":422},[412,7236,426],{"class":425},[412,7238,7239],{"class":433}," beforeOptimization",[412,7241,441],{"class":440},[412,7243,445],{"class":444},[412,7245,6771],{"class":448},[412,7247,4854],{"class":452},[412,7249,7250],{"class":414,"line":568},[412,7251,7252],{"class":418},"\u002F\u002F ... implementar otimizações ...\n",[412,7254,7255,7257,7260,7262,7264,7266],{"class":414,"line":604},[412,7256,426],{"class":425},[412,7258,7259],{"class":433}," afterOptimization",[412,7261,441],{"class":440},[412,7263,445],{"class":444},[412,7265,6771],{"class":448},[412,7267,4854],{"class":452},[412,7269,7270],{"class":414,"line":635},[412,7271,1745],{"emptyLinePlaceholder":37},[412,7273,7274,7276,7278,7280,7282,7284,7287,7289,7292,7295,7297,7300,7302,7304,7307,7309,7311,7313,7315,7318,7320,7322,7324,7326,7328,7330],{"class":414,"line":797},[412,7275,6063],{"class":452},[412,7277,588],{"class":429},[412,7279,6068],{"class":448},[412,7281,453],{"class":452},[412,7283,576],{"class":456},[412,7285,7286],{"class":460},"Improvement: ",[412,7288,582],{"class":456},[412,7290,7291],{"class":4469},"((",[412,7293,7294],{"class":452},"before",[412,7296,6878],{"class":440},[412,7298,7299],{"class":452}," after",[412,7301,5318],{"class":4469},[412,7303,4472],{"class":440},[412,7305,7306],{"class":452}," before",[412,7308,4878],{"class":440},[412,7310,6481],{"class":1670},[412,7312,597],{"class":4469},[412,7314,588],{"class":456},[412,7316,7317],{"class":448},"toFixed",[412,7319,453],{"class":4469},[412,7321,1671],{"class":1670},[412,7323,597],{"class":4469},[412,7325,2388],{"class":456},[412,7327,2621],{"class":460},[412,7329,576],{"class":456},[412,7331,638],{"class":452},[353,7333,7335],{"id":7334},"_3-usuário-final-é-prioridade","3. Usuário Final é Prioridade",[343,7337,7339],{"className":406,"code":7338,"language":408,"meta":351,"style":351},"\u002F\u002F Otimizações que realmente importam:\nconst userImpact = {\n  'LCP \u003C 2.5s': 'Perceived performance',\n  'FID \u003C 100ms': 'Interactivity', \n  'CLS \u003C 0.1': 'Visual stability'\n}\n",[338,7340,7341,7346,7357,7377,7399,7417],{"__ignoreMap":351},[412,7342,7343],{"class":414,"line":415},[412,7344,7345],{"class":418},"\u002F\u002F Otimizações que realmente importam:\n",[412,7347,7348,7350,7353,7355],{"class":414,"line":422},[412,7349,426],{"class":425},[412,7351,7352],{"class":433}," userImpact",[412,7354,441],{"class":440},[412,7356,741],{"class":429},[412,7358,7359,7361,7364,7366,7368,7370,7373,7375],{"class":414,"line":568},[412,7360,1872],{"class":456},[412,7362,7363],{"class":1875},"LCP \u003C 2.5s",[412,7365,457],{"class":456},[412,7367,399],{"class":429},[412,7369,1892],{"class":456},[412,7371,7372],{"class":460},"Perceived performance",[412,7374,457],{"class":456},[412,7376,1900],{"class":429},[412,7378,7379,7381,7384,7386,7388,7390,7393,7395,7397],{"class":414,"line":604},[412,7380,1872],{"class":456},[412,7382,7383],{"class":1875},"FID \u003C 100ms",[412,7385,457],{"class":456},[412,7387,399],{"class":429},[412,7389,1892],{"class":456},[412,7391,7392],{"class":460},"Interactivity",[412,7394,457],{"class":456},[412,7396,466],{"class":429},[412,7398,565],{"class":452},[412,7400,7401,7403,7406,7408,7410,7412,7415],{"class":414,"line":635},[412,7402,1872],{"class":456},[412,7404,7405],{"class":1875},"CLS \u003C 0.1",[412,7407,457],{"class":456},[412,7409,399],{"class":429},[412,7411,1892],{"class":456},[412,7413,7414],{"class":460},"Visual stability",[412,7416,1931],{"class":456},[412,7418,7419],{"class":414,"line":797},[412,7420,800],{"class":429},[330,7422,1181],{"id":1180},[321,7424,7425,7426,7429],{},"Essas otimizações resultaram em ",[325,7427,7428],{},"melhorias reais e mensuráveis"," nos meus projetos:",[358,7431,7432,7437,7442,7447],{},[361,7433,7434],{},[325,7435,7436],{},"40%+ melhoria na performance",[361,7438,7439],{},[325,7440,7441],{},"Bundle 43% menor",[361,7443,7444],{},[325,7445,7446],{},"Build time 39% mais rápido",[361,7448,7449],{},[325,7450,7451],{},"Lighthouse score 95+",[321,7453,7454,7457,7458,7461],{},[325,7455,7456],{},"A chave",": Não otimize tudo de uma vez. ",[325,7459,7460],{},"Meça, implemente, meça novamente",". Performance é uma jornada, não um destino.",[1230,7463],{},[321,7465,7466],{},[1235,7467,7468,7469,7472],{},"Quer implementar essas otimizações no seu projeto? Me siga no ",[1239,7470,24],{"href":1241,"rel":7471},[1243]," para mais dicas práticas de performance!",[321,7474,7475],{},[1235,7476,7477],{},"Tem alguma otimização específica que gostaria de ver? Deixe um comentário!",[1246,7479,7480],{},"html pre.shiki code .sutJx, html code.shiki .sutJx{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#6A737D;--shiki-default-font-style:inherit;--shiki-dark:#6A737D;--shiki-dark-font-style:inherit}html pre.shiki code .sVHd0, html code.shiki .sVHd0{--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#D73A49;--shiki-default-font-style:inherit;--shiki-dark:#F97583;--shiki-dark-font-style:inherit}html pre.shiki code .sGLFI, html code.shiki .sGLFI{--shiki-light:#6182B8;--shiki-default:#6F42C1;--shiki-dark:#B392F0}html pre.shiki code .su5hD, html code.shiki .su5hD{--shiki-light:#90A4AE;--shiki-default:#24292E;--shiki-dark:#E1E4E8}html pre.shiki code .sP7_E, html code.shiki .sP7_E{--shiki-light:#39ADB5;--shiki-default:#24292E;--shiki-dark:#E1E4E8}html pre.shiki code .skxfh, html code.shiki .skxfh{--shiki-light:#E53935;--shiki-default:#24292E;--shiki-dark:#E1E4E8}html pre.shiki code .s_hVV, html code.shiki .s_hVV{--shiki-light:#90A4AE;--shiki-default:#005CC5;--shiki-dark:#79B8FF}html pre.shiki code .smGrS, html code.shiki .smGrS{--shiki-light:#39ADB5;--shiki-default:#D73A49;--shiki-dark:#F97583}html pre.shiki code .sjJ54, html code.shiki .sjJ54{--shiki-light:#39ADB5;--shiki-default:#032F62;--shiki-dark:#9ECBFF}html pre.shiki code .s_sjI, html code.shiki .s_sjI{--shiki-light:#91B859;--shiki-default:#032F62;--shiki-dark:#9ECBFF}html pre.shiki code .sZUrc, html code.shiki .sZUrc{--shiki-light:#E53935;--shiki-default:#032F62;--shiki-dark:#9ECBFF}html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html pre.shiki code .sbgvK, html code.shiki .sbgvK{--shiki-light:#E2931D;--shiki-default:#6F42C1;--shiki-dark:#B392F0}html pre.shiki code .sQzsp, html code.shiki .sQzsp{--shiki-light:#E53935;--shiki-default:#22863A;--shiki-dark:#85E89D}html pre.shiki code .s9AJx, html code.shiki .s9AJx{--shiki-light:#9C3EDA;--shiki-default:#6F42C1;--shiki-dark:#B392F0}html pre.shiki code .sbsja, html code.shiki .sbsja{--shiki-light:#9C3EDA;--shiki-default:#D73A49;--shiki-dark:#F97583}html pre.shiki code .sfo-9, html code.shiki .sfo-9{--shiki-light:#90A4AE;--shiki-default:#032F62;--shiki-dark:#9ECBFF}html pre.shiki code .sjYin, html code.shiki .sjYin{--shiki-light:#90A4AE;--shiki-light-font-weight:inherit;--shiki-default:#22863A;--shiki-default-font-weight:bold;--shiki-dark:#85E89D;--shiki-dark-font-weight:bold}html pre.shiki code .s39Yj, html code.shiki .s39Yj{--shiki-light:#39ADB5;--shiki-default:#005CC5;--shiki-dark:#79B8FF}html pre.shiki code .stzsN, html code.shiki .stzsN{--shiki-light:#91B859;--shiki-default:#005CC5;--shiki-dark:#79B8FF}html pre.shiki code .s99_P, html code.shiki .s99_P{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#E36209;--shiki-default-font-style:inherit;--shiki-dark:#FFAB70;--shiki-dark-font-style:inherit}html pre.shiki code .syTEX, html code.shiki .syTEX{--shiki-light:#FF5370;--shiki-default:#005CC5;--shiki-dark:#79B8FF}html pre.shiki code .srdBf, html code.shiki .srdBf{--shiki-light:#F76D47;--shiki-default:#005CC5;--shiki-dark:#79B8FF}html pre.shiki code .sseR_, html code.shiki .sseR_{--shiki-light:#9C3EDA;--shiki-default:#005CC5;--shiki-dark:#79B8FF}html pre.shiki code .sfCm-, html code.shiki .sfCm-{--shiki-light:#90A4AE;--shiki-default:#6F42C1;--shiki-dark:#B392F0}html pre.shiki code .sZMiF, html code.shiki .sZMiF{--shiki-light:#E2931D;--shiki-default:#005CC5;--shiki-dark:#79B8FF}",{"title":351,"searchDepth":422,"depth":422,"links":7482},[7483,7487,7491,7495,7499,7503,7507,7511,7515,7519,7523,7526,7529,7534],{"id":3325,"depth":422,"text":3326,"children":7484},[7485,7486],{"id":3329,"depth":568,"text":3330},{"id":3359,"depth":568,"text":3360},{"id":3383,"depth":422,"text":3384,"children":7488},[7489,7490],{"id":3387,"depth":568,"text":3388},{"id":3662,"depth":568,"text":3663},{"id":3775,"depth":422,"text":3776,"children":7492},[7493,7494],{"id":3779,"depth":568,"text":3780},{"id":3930,"depth":568,"text":3931},{"id":4075,"depth":422,"text":4076,"children":7496},[7497,7498],{"id":4079,"depth":568,"text":4080},{"id":4647,"depth":568,"text":4648},{"id":4745,"depth":422,"text":4746,"children":7500},[7501,7502],{"id":4749,"depth":568,"text":4750},{"id":4954,"depth":568,"text":4955},{"id":5171,"depth":422,"text":5172,"children":7504},[7505,7506],{"id":5175,"depth":568,"text":5176},{"id":5515,"depth":568,"text":5516},{"id":5599,"depth":422,"text":5600,"children":7508},[7509,7510],{"id":5603,"depth":568,"text":5604},{"id":5782,"depth":568,"text":5783},{"id":5948,"depth":422,"text":5949,"children":7512},[7513,7514],{"id":5952,"depth":568,"text":5953},{"id":6150,"depth":568,"text":6151},{"id":6284,"depth":422,"text":6285,"children":7516},[7517,7518],{"id":6288,"depth":568,"text":6289},{"id":6507,"depth":568,"text":6508},{"id":6698,"depth":422,"text":6699,"children":7520},[7521,7522],{"id":6702,"depth":568,"text":6703},{"id":6751,"depth":568,"text":6752},{"id":7009,"depth":422,"text":7010,"children":7524},[7525],{"id":7013,"depth":568,"text":7014},{"id":7134,"depth":422,"text":7135,"children":7527},[7528],{"id":7138,"depth":568,"text":7139},{"id":7206,"depth":422,"text":7207,"children":7530},[7531,7532,7533],{"id":7210,"depth":568,"text":7211},{"id":7221,"depth":568,"text":7222},{"id":7334,"depth":568,"text":7335},{"id":1180,"depth":422,"text":1181},"2024-12-17","Técnicas avançadas de otimização de performance em Nuxt.js que implementei em projetos reais, com resultados mensuráveis e código prático.","https:\u002F\u002Fvueschool.io\u002F_ipx\u002Ff_webp&q_100&s_1200x1200\u002Fhttps:\u002F\u002Fvueschool.io\u002Fstorage\u002Fmedia\u002Fd83cfd96e2106a8f682e8093c595dc62\u002FThe-Ultimate-Guide-to-Vue-Performance.png",{"author":7539},{"name":1294,"avatar":7540,"bio":1297,"social":7541},{"src":1296},{"github":1241,"linkedin":1299},"\u002Fblog\u002Fnuxt-performance-otimizacoes-avancadas",{"title":3310,"description":7536},"blog\u002Fnuxt-performance-otimizacoes-avancadas",[1304,1305,7546,7547,6010],"otimizacao","lighthouse","TOswmaaeN8eFO4U-wAf3zuMT3OKg8g0Ffq-DHY_RuIY",[7550,7551,7552,7553],{"title":316,"path":1300,"description":1289},{"title":1309,"path":3300,"description":3294},{"title":3310,"path":7542,"description":7536},{"title":7554,"path":7555,"description":7556},"O Futuro do Ecossistema Nuxt.js: Tendências que Vão Moldar o Desenvolvimento Front-end em 2025","\u002Fblog\u002Fnuxt-ecosystem-futuro-desenvolvimento","Análise profunda das tendências emergentes no ecossistema Nuxt.js, incluindo AI, edge computing, e as tecnologias que vão revolucionar o desenvolvimento front-end.",1792609231401]