Quelques optimisations de taille JS et 🐛 en moins
publié le , mis à jour⚙️ Ceci est une proposition de changement de code.
Rendez-vous sur sa page Coderberg pour l'osculter.
C'est la cata ! On charge beaucoup trop de JS au premier chargement.
- optimiser le bundle : enlever Sentry qu'on n'utilise pas
- charger en lazy les traductions de tags
- mmmh je ne pige pas pourquoi ça ne fonctionne pas. Next dynamic fait planter le chargement de lieu, et react lazy+suspense ne fonctionne pas, c'est chargé sans lieu. Peut-être parce que Content est chargé sans lieu ? J'ai testé avec un nouveau composant tampon, rien à faire. Bon, je vais voir pour charger ça via une API, au moins ce sera réglé.
- charger terradraw en lazy
Concernant opening_hours, il faudrait aussi la charger en lazy mais c'est pas trivial. Et puis c'est si important... Peut-être cela dit qu'on devrait le mettre derrière une API. Je suis pas trop chaud de quitter à ce point la SPA. Les gens aiment les applis, tant que c'est pas trop lent au chargement et mis en cache.
Aussi :
- mettre en cache maplibre basé sur le numéro de version. C'est la grosse dépendance de 1 Mo non-gzippée. Voir https://adactio.medium.com/progressively-enhancing-maps-07778db5946f
À noter : étant donnée la politique de mise en cache, cela n'a d'impact pour les utilisateurs réguliers qu'après un re-bundle. Car sinon, c'est mis en cache !
Ah ! Non je vois que Webpack créée le hash en fonction du contenu. Donc tant que MapLibre ne change pas, aucune raison que le navigateur le charge à nouveau !
Mais pour l'utilisateur qui découvre cartes.app, notamment via un lien de moteur de recherche ou partage entre amis, c'est la cata, mais on ne peut rien y faire ou presque !
- [ ] Mise en cache des tuiles https://codeberg.org/cartes/web/issues/1078
etienneJr
Mazette c'est sidérant cette représentation.
En plus du JS il faut rajouter d'autres choses, non ? Au moins toutes les icônes du fond de carte.
C'est quoi opentelemetry ? C'est énorme aussi.
C'est quoi qu'on pourrait passer en api pour gagner du temps de chargement initial ? Le risque alors ça sera de saturer le serveur de mini requêtes, non ?
laem
En plus du JS il faut rajouter d'autres choses, non ? Au moins toutes les icônes du fond de carte.
Oui carrément. Les images sont souvent la charge principale des sites. Ici pour nous c'est les tuiles évidemment. Mais la différence, c'est que le JS / HTML est nécessaire avant toute autre intéraction et qu'il coût à être interprété. Donc c'est une priorité, mais pas la seule.
C'est quoi opentelemetry ? C'est énorme aussi.
Viré. Je crois que ça venait de Sentry.
C'est quoi qu'on pourrait passer en api pour gagner du temps de chargement initial ? Le risque alors ça sera de saturer le serveur de mini requêtes, non ?
Je l'ai fait pour les traductions des tags. C'est bien car de toutes façon, pour supporter d'autres langues, il fallait le faire sauf à sur-surcharger notre bundle initial.
Je ne compte pas passer trop de trucs en API, car ça reste une ".app".