Оффлайн
- Регистрация
- 1 Мар 2015
- Сообщения
- 1,481
- Баллы
- 155
Aprenda 5 técnicas práticas para melhorar o desempenho de apps FastAPI com Python e Vue.js. Exemplos de código, erros comuns e casos reais incluídos!
Introdução
FastAPI tornou-se um framework essencial para APIs rápidas e escaláveis. Combinado com Vue.js no frontend, permite criar aplicações modernas, mas otimizar performance exige estratégias específicas. Veja como evitar gargalos e garantir velocidade em produção.
1. Async/Await: Domine a Execução Não-Bloqueante (Python)
Problema: Rotas síncronas bloqueiam o event loop do FastAPI, reduzindo throughput.
Solução: Use async def para operações I/O (chamadas a APIs, bancos de dados).
from fastapi import FastAPI
import httpx
app = FastAPI()
@app.get("/dados-externos")
async def fetch_data():
async with httpx.AsyncClient() as client:
resposta = await client.get("")
return resposta.json()
Comparação:
Cenário: Consultas repetidas ao banco aumentam latência.
Implementação:
from fastapi import FastAPI
from redis import asyncio as aioredis
app = FastAPI()
redis = aioredis.from_url("redis://localhost")
@app.get("/produto/{id}")
async def get_produto(id: int):
cache = await redis.get(f"produto:{id}")
if cache:
return JSONResponse(content=json.loads(cache))
# Consulta ao banco e atualização do cache...
Ferramenta: Use docker-compose para subir Redis rapidamente:
services:
redis:
image: redis:alpine
ports:
- "6379:6379"
3. Otimização de Consultas no Banco de Dados (SQLAlchemy)
Erro Comum: Trazer todas as colunas com SELECT *.
Solução: Use .options(load_only()) no SQLAlchemy:
from sqlalchemy.orm import load_only
produtos = await db.execute(
select(Produto).options(load_only(Produto.nome, Produto.preço))
)
Dica: Índices para campos filtrados (ex: produto.categoria_id).
4. Compressão de Respostas HTTP (FastAPI Middleware)
Impacto: Reduz tamanho de payloads em até 70%.
Implementação:
from fastapi.middleware.gzip import GZipMiddleware
app.add_middleware(GZipMiddleware, minimum_size=500)
Configuração: Aplique apenas para conteúdos grandes (ex: JSON, HTML).
5. Lazy Loading no Vue.js (Frontend)
Problema: Carregamento inicial lento de SPA.
Solução: Dynamic imports para componentes não críticos:
// Vue 3
const ModalLogin = defineAsyncComponent(() => import('@/components/ModalLogin.vue'));
Framework: Use vite-plugin-pages para rotas automáticas com code splitting.
Caso Real: E-commerce com 10k Requisições/Minuto
Desafio: Latência de 2s na página de produtos.
Soluções Aplicadas:
Misturar código síncrono (ex: requests.get) em rotas assíncronas.
Não usar conexões persistentes para bancos de dados (ex: reutilize pools).
Ignorar monitoramento (implemente métricas com Prometheus + Grafana).
Conclusão
Otimizar aplicações FastAPI exige atenção a back-end (Python) e front-end (Vue.js). Experimente as técnicas acima, monitore resultados com ferramentas como Locust para testes de carga, e compartilhe sua experiência nos comentários!
Introdução
FastAPI tornou-se um framework essencial para APIs rápidas e escaláveis. Combinado com Vue.js no frontend, permite criar aplicações modernas, mas otimizar performance exige estratégias específicas. Veja como evitar gargalos e garantir velocidade em produção.
1. Async/Await: Domine a Execução Não-Bloqueante (Python)
Problema: Rotas síncronas bloqueiam o event loop do FastAPI, reduzindo throughput.
Solução: Use async def para operações I/O (chamadas a APIs, bancos de dados).
from fastapi import FastAPI
import httpx
app = FastAPI()
@app.get("/dados-externos")
async def fetch_data():
async with httpx.AsyncClient() as client:
resposta = await client.get("")
return resposta.json()
Comparação:
- Síncrono: 100 req/s → Assíncrono: 1500+ req/s (teste com 10 workers).
Cenário: Consultas repetidas ao banco aumentam latência.
Implementação:
from fastapi import FastAPI
from redis import asyncio as aioredis
app = FastAPI()
redis = aioredis.from_url("redis://localhost")
@app.get("/produto/{id}")
async def get_produto(id: int):
cache = await redis.get(f"produto:{id}")
if cache:
return JSONResponse(content=json.loads(cache))
# Consulta ao banco e atualização do cache...
Ferramenta: Use docker-compose para subir Redis rapidamente:
services:
redis:
image: redis:alpine
ports:
- "6379:6379"
3. Otimização de Consultas no Banco de Dados (SQLAlchemy)
Erro Comum: Trazer todas as colunas com SELECT *.
Solução: Use .options(load_only()) no SQLAlchemy:
from sqlalchemy.orm import load_only
produtos = await db.execute(
select(Produto).options(load_only(Produto.nome, Produto.preço))
)
Dica: Índices para campos filtrados (ex: produto.categoria_id).
4. Compressão de Respostas HTTP (FastAPI Middleware)
Impacto: Reduz tamanho de payloads em até 70%.
Implementação:
from fastapi.middleware.gzip import GZipMiddleware
app.add_middleware(GZipMiddleware, minimum_size=500)
Configuração: Aplique apenas para conteúdos grandes (ex: JSON, HTML).
5. Lazy Loading no Vue.js (Frontend)
Problema: Carregamento inicial lento de SPA.
Solução: Dynamic imports para componentes não críticos:
// Vue 3
const ModalLogin = defineAsyncComponent(() => import('@/components/ModalLogin.vue'));
Framework: Use vite-plugin-pages para rotas automáticas com code splitting.
Caso Real: E-commerce com 10k Requisições/Minuto
Desafio: Latência de 2s na página de produtos.
Soluções Aplicadas:
- Cache de catálogo com Redis (TTL de 10min).
- Compressão GZip + otimização de imagens via CDN.
- Async endpoints para tracking de usuários. Resultado: Latência média de 400ms e redução de 40% no uso do servidor.
Misturar código síncrono (ex: requests.get) em rotas assíncronas. Não usar conexões persistentes para bancos de dados (ex: reutilize pools). Ignorar monitoramento (implemente métricas com Prometheus + Grafana).Conclusão
Otimizar aplicações FastAPI exige atenção a back-end (Python) e front-end (Vue.js). Experimente as técnicas acima, monitore resultados com ferramentas como Locust para testes de carga, e compartilhe sua experiência nos comentários!