Leaflet is painfully slow in mobile

[kimmobrunfeldt]

_I also submitted the same issue to Mapbox project: https://github.com/mapbox/mapbox.js/issues/947_
The same symptoms I describe below can be also seen in Leaflet home page.

I switched from Google Maps to Mapbox because they(you) have much better API and support for customizations. Thanks for the awesome work! However, Leaflet feels very slow when used from mobile compared to Google Maps.

The map tiles seem to load a bit slower in Mapbox but that's not the actual problem. The problem is that when Mapbox loads new tiles, user interactions might stop completely. It causes the overall usage to be quite annoying when you want to pinch zoom and pan into an area quickly. I setup two nearly identical demos based on the site I'm currently working on:

• http://kimmobrunfeldt.github.io/googlemaps-demo/app/
• http://kimmobrunfeldt.github.io/mapbox-demo/app/

Both work quite well in the desktop, but even then you can notice the problem with Mapbox when you zoom, and very quickly after that pan the map. The pan movement doesn't work in that scenario. In mobile the slowness is much more noticeable since the pinch zoom, pan, pinch zoom movements are so quick.

I don't know if these give any more insight but here's two videos of me pinch zooming and panning the sites with iPhone 6, iOS 8.1 Safari:

• Google Maps video: https://vimeo.com/119376466
• Mapbox video: https://vimeo.com/119376525

[mourner]

Leaflet is not "painfully slow" on mobile. From what I see in the video, you actually complain about Leaflet not reacting to touch events _during_ zoom animation, which is completely unrelated to performance (which is quite good). If you want to get a similar behavior to Google Maps, try adjusting the zoom animation time in leaflet.css from 0.25s to something smaller.

[kimmobrunfeldt]

I have no details of the internals, but the end user experience is painfully slow, even though the performance is good. I also explained that the "slow" feeling is related to the zooming. I'll try to adjust the zooming time.

[mourner]

@kimmobrunfeldt I never saw people browsing the map like this in practice. I think you're exaggerating the issue quite a bit.

[kimmobrunfeldt]

I agree, I was exaggerating a bit. But still, the issue is noticeable even when pinching and panning in normal speed.

Decreasing the zoom animation to 0.1s works like a charm :+1: Thanks! I would consider to decrease the zoom animation duration for touch devices.

[mourner]

Yeah, that might be a good idea.

[livemixlove]

For anyone coming here for the same problem: I fixed this same issue by adding

<meta name="viewport" content="initial-scale=1, maximum-scale=1">

to my header. The issue was that IOS was rendering a larger map area than needed, then zooming it out, and slowing everything down.

[moviejb]

hello everyone, I am not an expert but I created my map leaflet . I view the markers around the user's location . There are many ( less than 100 ) but it is very slow to open popups . How can I fix the problem? It is too slow. Can someone help me?
Thank you
Antonio

[perliedman]

@moviejb Hi and thanks for using Leaflet!

Please note that this is our issue tracker, where bugs and feature requests and posted and discussed. For questions on how to use Leaflet and other support, you're better off using stackoverflow or gis.stackexchange.com.