Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
ENTREGANDO UMA EXPERIÊNCIA MELHOR COM SWR
Search
Tailo Mateus Gonsalves
January 22, 2021
Programming
0
110
ENTREGANDO UMA EXPERIÊNCIA MELHOR COM SWR
Tailo Mateus Gonsalves
January 22, 2021
Tweet
Share
More Decks by Tailo Mateus Gonsalves
See All by Tailo Mateus Gonsalves
BATE PAPO SOBRE A VIDA, A CARREIRA E TUDO MAIS!
tailomateus
0
15
React components - Melhores práticas
tailomateus
0
19
Chapter Lead
tailomateus
0
29
Arquitetura_Front-end.pdf
tailomateus
0
110
Other Decks in Programming
See All in Programming
Rubyでやりたい駆動開発 / Ruby driven development
chobishiba
1
520
Go1.25からのGOMAXPROCS
kuro_kurorrr
1
830
来たるべき 8.0 に備えて React 19 新機能と React Router 固有機能の取捨選択とすり合わせを考える
oukayuka
2
880
第9回 情シス転職ミートアップ 株式会社IVRy(アイブリー)の紹介
ivry_presentationmaterials
1
260
WebViewの現在地 - SwiftUI時代のWebKit - / The Current State Of WebView
marcy731
0
100
20250704_教育事業におけるアジャイルなデータ基盤構築
hanon52_
1
140
地方に住むエンジニアの残酷な現実とキャリア論
ichimichi
5
1.4k
データの民主化を支える、透明性のあるデータ利活用への挑戦 2025-06-25 Database Engineering Meetup#7
y_ken
0
330
スタートアップの急成長を支えるプラットフォームエンジニアリングと組織戦略
sutochin26
0
150
Hypervel - A Coroutine Framework for Laravel Artisans
albertcht
1
110
GraphRAGの仕組みまるわかり
tosuri13
8
500
Google Agent Development Kit でLINE Botを作ってみた
ymd65536
2
210
Featured
See All Featured
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
panda_program
107
19k
The World Runs on Bad Software
bkeepers
PRO
69
11k
A Tale of Four Properties
chriscoyier
160
23k
The Web Performance Landscape in 2024 [PerfNow 2024]
tammyeverts
8
680
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
tammyeverts
5
230
The Psychology of Web Performance [Beyond Tellerrand 2023]
tammyeverts
48
2.9k
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
tammyeverts
53
2.8k
Product Roadmaps are Hard
iamctodd
PRO
54
11k
It's Worth the Effort
3n
185
28k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
46
9.6k
Being A Developer After 40
akosma
90
590k
YesSQL, Process and Tooling at Scale
rocio
173
14k
Transcript
Apresentação de Tailo Mateus Gonsalves ENTREGANDO UMA EXPERIÊNCIA MELHOR COM
SWR
Usa dados antigos enquanto avalia se tem novos dados
• Back-end agnostic • Fast page navigation • Revalidation on
focus • Smart error retry • React Suspense • SSR/React Native support
Mensagem de carregamento enquanto busca dados do servidor Mostrar os
dados em cache enquanto recupera novos dados da API Problema Solução
None
1. Construído com React Suspense 2. Permite buscar dados
const Page = React.lazy(() => import('./Page')); <Suspense fallback={<Spinner />}> <Page
/> </Suspense>
1. Construído com React Suspense 2. Permite buscar dados
import useSWR from 'swr' export function useFetch(url) { const {
data, error } = useSWR(url, async url => { const response = await api.get(url) return response.data; }) return { data, error } }
None
1 - Renderizado no servidor; 2 - Equipado com SWR.
Dados atualizados ao longo do tempo e das interações do usuário.
const Page = () => { const { data }
= useSWR<any>('/training', fetcher); return ( <Suspense fallback={<div>loading...</div>}> <Profile/> </Suspense> ) }
None