Dev.to AI 🤖 Ai 👁 0 📖 3 min read

React Native ve FastAPI ile Yapay Zeka Destekli Mobil Uygulama Mimarisi: SafeBite AI

Yapay zeka modellerini mobil bir uygulamaya entegre etmek ilk bakışta basit bir API çağrısı gibi görünse de; ağ gecikmesi, görsel boyutu optimizasyonu ve deterministik veri çıkışı alma gibi konular işin içine girdiğinde

Yapay zeka modellerini mobil bir uygulamaya entegre etmek ilk bakışta basit bir API çağrısı gibi görünse de; ağ gecikmesi, görsel boyutu optimizasyonu ve deterministik veri çıkışı alma gibi konular işin içine girdiğinde ciddi bir mühendislik mimarisi gerektiriyor.

Bu yazıda, yakın zamanda iOS App Store'da yayına aldığım SafeBite AI uygulamasının teknik mimarisini, mobil kamera akışından API'ye kadar uzanan hattı ve karşılaştığım optimizasyon problemlerini nasıl çözdüğümü paylaşıyorum.

📲 Uygulama Linki: SafeBite AI - iOS App Store

🛠 Sistem Mimarisi

Uygulamanın uçtan uca akışı temel olarak üç katmandan oluşuyor:

  1. İstemci (Mobile Client - React Native): Kullanıcının kamera ile etiket fotoğrafı çekmesini, görselin istemci tarafında sıkıştırılmasını ve sonuçların anlık kullanıcıya sunulmasını yönetir.
  2. Backend Gateway (FastAPI - Python): Mobil istemciden gelen istekleri karşılayan, gelen görselleri ön işlemeden geçiren ve model orkestrasyonunu sağlayan yüksek performanslı asenkron API katmanı.
  3. Yapay Zeka & Çok Modlu (Multimodal) Çıkarım: Etiket üzerindeki içerik metinlerini ayrıştıran, kullanıcının alerjen profiliyle eşleştiren ve yapılandırılmış JSON çıktısı üreten model hattı.
[React Native Mobil Uygulama]
           │  (Sıkıştırılmış Görsel + Kullanıcı Profili)
           ▼
[FastAPI Backend Gateway]
           │  (Pydantic Doğrulama & Prompt Orkestrasyonu)
           ▼
[Çok Modlu Yapay Zeka Hattı]
           │  (Yapılandırılmış JSON Yanıtı)
           ▼
[Mobil Arayüz (Anlık Alerjen & Güvenilirlik Raporu)]

⚡ Karşılaşılan Teknik Zorluklar ve Çözümler

1. Ağ Bant Genişliği ve Gecikme (Latency) Optimizasyonu

Kullanıcının kameradan çektiği 4K çözünürlüğündeki ham görselleri doğrudan backend API'ye yüklemek hem mobil ağlarda ciddi bir gecikmeye yol açıyor hem de sunucu tarafında gereksiz kaynak tüketiyor.

  • Çözüm: İstemci tarafında görsel ön işleme pipeline'ı kurarak resim çözünürlüğünü ve kalitesini optimize ettim. OCR ve çok modlu modellerin metin okuma başarımını düşürmeyecek bir eşik belirleyerek görsel boyutunu ~800 KB seviyesine çektim. Bu optimizasyon, mobil taraftaki istek süresini (roundtrip latency) yaklaşık %60 oranında azalttı.

2. Yapay Zekadan Deterministik JSON Çıktısı Alma

Büyük dil modelleri (LLM) serbest metin üretmeye meyillidir. Mobil istemcinin arayüzü hatasız çizebilmesi için her zaman aynı veri şemasının dönmesi gerekir.

  • Çözüm: FastAPI tarafında Pydantic kütüphanesini kullanarak kesin veri modelleri tanımladım. Model sistem prompt'larına JSON şema kısıtları ve few-shot örnekleri ekleyerek çıktıyı tip güvenli (type-safe) hale getirdim:
from pydantic import BaseModel
from typing import List

class AllergenResult(BaseModel):
    is_safe: bool
    detected_allergens: List[str]
    confidence_score: float
    summary: str

3. App Store Onay Süreçleri ve Güvenlik

Sağlık ve gıda hassasiyeti içeren yapay zeka projelerinde Apple'ın inceleme kuralları oldukça katıdır. Uygulamanın tıbbi tavsiye vermediğini belirten sorumluluk reddi metinleri ve model güven skorunun düşük olduğu durumlarda devreye giren fallback mekanizmaları tasarlayarak onay sürecini başarıyla tamamladım.

🎯 Çıkarımlar

Bu projeyi sıfırdan hayata geçirip App Store'a taşımak; yapay zeka mühendisliğinin asıl zorluğunun model çağırmak değil, uçtan uca veri hattı performansı, hata toleransı ve kullanıcı deneyimi inşa etmek olduğunu bir kez daha gösterdi.

Siz mobil uygulamalarınızda yapay zeka modellerini entegre ederken gecikme ve veri doğrulama sorunlarını nasıl çözüyorsunuz? Yorumlarda tartışalım!

📰 Read the original article on Dev.to AI

Originally published by Dev.to AI. Aggregated on AIWithGhost for educational purposes — full credit and traffic to the original publisher.