Stratégie d'optimisation pour créer des milliers d'infowindows sur une carte Google

Question

Je suis nouveau dans l'API Google Maps et je viens de reprendre une application ROR qui trace jusqu'à 2 000 marqueurs sur une carte utilisant MarkerCluster et chaque marqueur a un infoindow associé.

L'implémentation actuelle crée un tableau de chaînes de contenu Infowindow dans JavaScript et télécharge le javascript au navigateur. Non compressé (sans compression de contenu du serveur), le tableau et JavaScript peuvent être aussi grands que 9 Mo.

Les goulots d'étranglement des performances associés à cette implémentation que j'ai trouvés sont: 1. Temps sur serveur pour créer 2000 chaînes et les mettre dans le tableau JavaScript. (~ 4-5 secondes) 2. Temps sur serveur pour compresser le JavaScript de plusieurs mégabytets avant d'envoyer au navigateur. (~ 2-3 secondes)

Mes initiales ont pensé à créer un modèle pour la chaîne de contenu Infowindow qui contient tout le formatage HTML afin que les seules données contenues dans le tableau des contenus Infowindow soient les nombres bruts réels à afficher. Cela devrait réduire considérablement le temps de calcul pour assembler le tableau des chaînes de contenu sur le serveur et réduire en conséquence la mémoire consommée par le tableau dans le navigateur. De plus, un seul Infowindow doit être ouvert à la fois.

N'étant pas familier avec l'API Google Maps V3, je cherche des conseils quant à savoir s'il s'agit ou non de la meilleure stratégie d'optimisation. Et, tous les conseils sur des échantillons de code qui implémentent ce type de stratégie.

Merci d'avance,

-Scott

Answer 1

Je pense que vous ne devriez pas charger tous les ensembles de données 2000 dans votre tableau, mais faire l'une des 2 alternatives:

1. Vous ne chargez que les marqueurs et donc les Infowindows qui se trouvent dans la fenêtre actuelle.
2. Vous chargez le contenu Infowindow par Ajax, lorsque vous cliquez sur le marqueur.