Widget publicitaire Konnectz : Performance et Personnalisation pour la Presse Digitale

Face à la demande croissante d'outils publicitaires efficaces et intégrés pour les médias en ligne, j'ai développé le Widget publicitaire Konnectz. Ce widget plug & play est piloté par un back office user-friendly, permettant aux médias de gérer facilement leurs contenus publicitaires. L'objectif était de créer un widget léger, performant, personnalisable et capable de s'adapter à un grand nombre de sites sans perturber leur fonctionnement.

Description du projet

Le widget Konnectz a été conçu pour être extrêmement flexible et performant. J'ai utilisé des technologies modernes telles que Mithril.js, ReactJS, NestJS, Typescript et Playwright pour les tests. Le projet, réalisé en 3 mois, a abouti à un widget capable de fonctionner sous deux formats (carousel et pageview), entièrement responsive et personnalisable selon le design du site du client. Voici quelques-unes de ses fonctionnalités clés :

• Création et programmation d'annonces/widgets
• Rotation automatique et mise en avant des annonces
• Adaptabilité à de nombreux appareils et navigateurs différents

J'ai travaillé seul sur ce projet, de la conception à la mise en production, assurant chaque aspect du développement pour garantir un produit final de haute qualité.

Défis et solutions

Le projet a présenté plusieurs défis majeurs :

Légèreté et performance du widget

Solution : Utilisation de Mithril.js pour un bundle réduit et optimisation des options de personnalisation récupérées directement du serveur.

Adaptabilité à divers sites sans perturber leur fonctionnement

Solution : Isolation des styles CSS et des scripts dans un scope dédié pour éviter les conflits avec les autres éléments du site.

Compatibilité avec différents appareils et navigateurs

Solution : Réduction des API web utilisées et utilisation de polyfills, avec tests automatisés sur divers navigateurs via Playwright.

Scalabilité de l'architecture

Solution : Utilisation de fichiers statiques et politique de cache optimisée, associée à une architecture scalable horizontalement via CDN et lazy-loading pour les images.

Définition des principales fonctionnalités via le feedback client

Solution : Collaboration étroite avec les premiers clients pour affiner et anticiper les besoins et fonctionnalités nécessaires.

J'ai envisagé des approches alternatives comme le rendu côté serveur (SSR) ou le service dynamique des widgets via API, mais elles se sont révélées trop coûteuses en ressources pour un gain de performance minimal.

Résultats et réflexions

Les résultats ont dépassé les attentes :

• +20M de chargements mensuels
• CTR 3x supérieur à celui des autres annonceurs (Google Ads, Outbrain, etc.)
• Script ultra léger de 28ko
• Chargement complet du widget en moins de 500ms
• Solution très rentable, ~100€ fixe + 1€ par million de chargements

Les utilisateurs ont apprécié la facilité de création et de paramétrage des widgets, ainsi que leur intégration discrète et rapide sur les sites.

Apprentissages et améliorations futures

Ce projet m'a permis d'apprendre de nombreuses techniques d'optimisation web et de maîtriser un nouveau framework (Mithril) qui a tenu ses promesses. J'ai également développé une nouvelle approche pour tester des solutions originales et optimisées.

Pour l'avenir, j'envisage des améliorations comme l'intégration de nouvelles fonctionnalités basées sur les retours utilisateurs et l'optimisation continue des performances.

Conclusion

Le développement du Widget publicitaire Konnectz a été une expérience enrichissante qui m'a permis de démontrer mes compétences techniques et interpersonnelles. Si vous souhaitez en savoir plus ou avez des suggestions, n'hésitez pas à me contacter :)