Payback

Dynamique des performances et architecture UI partagée

Optimisation des performances, architecture UI partagée entre web et mobile, et services backend événementiels pour les mises à jour temps réel.

Contexte

L’application devait gagner en réactivité, harmoniser ses interfaces web et mobiles et mieux prendre en charge les mises à jour temps réel.

Améliorer les performances des interactions les plus sensibles.
Structurer une architecture UI commune au web et au mobile.
Développer des services backend capables de diffuser des mises à jour temps réel.

Problème: Certaines interactions prenaient entre une et deux secondes, affectant l'expérience utilisateur.
Solution: Fort de mon expérience chez Jellysmack, j'ai analysé les chemins d'exécution critiques et mis en œuvre des optimisations pour réduire les temps de réponse. Passant des logiques UI en UI thread, et retravaillant les rendus forcé côté React Native pour améliorer la fluidité et la réactivité de l'application.
Effet: Les interactions critiques ont été ramenées à moins de 300 ms, améliorant significativement la réactivité de l'application.

Problème: L'équipe de développment étant petite (1 CTO + 1 dev), les interfaces web et mobile manquaient d’une fondation commune, entraînant des incohérences et des difficultés de maintenance.
Solution: En étroite collaboration avec le CTO et le design, j'ai conçu seul et mis en oeuvre une ébauche de design system partagé, permettant de réutiliser les composants UI entre les plateformes web et mobile via Styled components, assurant ainsi une cohérence visuelle et fonctionnelle, dans un monorepo NX.
Effet: L'ébauche de design system partagé a permis de poser les bases d'une architecture UI cohérente entre le web et le mobile, facilitant la maintenance et la réutilisation des composants.

Problème: Le produit avec besoin d'ajouter des mises à jour temps réel pour mieux évoluer avec les traitements événementiels au système déjà existant.
Solution: J'ai conçu et implémenté des services backend orientés événements, utilisant Temporal pour orchestrer les workflows et NestJS pour structurer les services, assurant ainsi la scalabilité et la réactivité de la plateforme. En collaboration avec le CTO et le développeur, nous avons intégré ces services au système existant.
Effet: Les services backend événementiels ont permis de diffuser des mises à jour en temps réel, améliorant la réactivité de la plateforme et la satisfaction des utilisateurs.