user2771801
user2771801

Reputation: 421

Google Map crashes in IOS7

We are developing an Hybrid app and we are using google map API in our application. When we are trying to load 2000 data markers in the map, it got crashed. Map is not get crashed in IOS6, IOS5. It is happening only in IOS7. Is there any memory related change done for ios7 application.

Upvotes: 42

Views: 19781

Answers (11)

Tuxzone
Tuxzone

Reputation: 44

Having experienced similar problems with Google Maps I tried to isolate a minimal test case. I wanted to see if this was perhaps a more general memory management issue.

This code that just stores random data in an array crashes Safari on IOS 7 on an iPad mini, 16GB:

function randomString(length, chars) {
    var result = '';
    for (var i = length; i > 0; --i) result += chars[Math.round(Math.random() * (chars.length - 1))];
    return result;
}

var arr = []
for (var i=0;i<5000;i++) {
    // one character is two bytes in JavaScript, so 512 chars is 1Kb:
    o = randomString(512, '0123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ');
    arr.push(o);
}

You can try this test with your own browser by going http://vici.org/memtest.html . The script on that page will try to claim 50Mb of memory, in steps of 1Mb. The script shows a running counter so you will see how well your browser performs and when it crashes (if it does). The script stores the results for each ip / user agent combination in a database to be able to draw some conclusions.

On average, IOS 6 (n=12) allows a script to claim about 12Mb. IOS 7 (n=47) allows a script to claim around 15 Mb. These are not hard limits. For both sets the standard devation was quite high, ~12 Mb. In the Xcode emulator Safari doesn't even crash at all (claiming the full 50Mb, probably because it has access to more RAM).

So we may conclude that the issue is not caused by IOS 7 leaving less memory for Safari. The problem seems to be, as was suggested by Philipp Kühn, that -in some specific cases? - Safari consumes significantly more memory than it did in IOS 6. One clue about the cause can be found at https://discussions.apple.com/message/23837361#23837361 where a page with 200 divs and the following CSS

div {
  -webkit-backface-visibility: hidden;
}

crashes safari.

It appears that using the Leaflet library circumvents the maps issue (see https://code.google.com/p/gmaps-api-issues/issues/detail?id= and https://github.com/Leaflet/Leaflet/pull/2149) however Leaflet circumvented the low memory crashes not by changes on the css but on the javascript level. Leaflet now circumvents statements like

context = this

This would suggest Safari doesn't clean up unused objects. As long as Apple doesn't fix Safari, perhaps Google could do changes similar to what the Leaflet guys have done?

In the mean time Apple has release IOS7.1 which doesn't fully solve the crashes but certainly makes them occur les often.

Upvotes: 8

Skye
Skye

Reputation: 93

Seems to be fixed in iOS 7.1

Yesterday on iOS 7.0.6, my map would crash Mobile Safari with more than 3,000 markers. Today after upgrading my iPad, I can load a map in Mobile Safari with over 15,000 markers.

Upvotes: 0

anshul
anshul

Reputation: 846

Heyy... I was also facing the similar problem. So, I tried this:

I cleared the application caches in "didReceiveMemoryWarning" method of my view controller and custom plugins and set the properties and variables to NIL in "onMemoryWarning" method of CDVPlugin class. And this approach did the work for me. I am not getting any crash as of now. Hope this helps.

Upvotes: 0

If you are dealing with a large number of markers, try using the MarkerClusterer. It will lower the number of concurrent markers significantly, and in our case it prevented the crash.

Upvotes: 0

Andrew
Andrew

Reputation: 505

Our application behaved in the same as the users above; everything worked well prior to iOS 7, yet crashed afterwards. The problem indeed does appear to be a memory issue. You can verify by checking the crash report logs on your device.

As our application was essential to a client, we couldn't sit and wait for a fix from Apple. In our case, the fix involved three specific strategies:

  1. Javascript code optimization. Our application was developed very quickly and turned from a prototype into a working system without extensive code planning. In our system, we were able to realize significant memory gains by optimizing the code. This meant deleting unused variables; take a look if you happen to store all the markers into a preliminary array as a response from your database. Delete these old arrays and unused variables once everything is loaded successfully. In addition, consider limiting included libraries, and employ common Javascript / jQuery best optimization practices.

  2. Empty info windows. The next memory-saving strategy came from NOT pre-loading each marker's info window screen with data. We stripped each info window bare, except for an empty div with unique ID, which would then be loaded asynchronously on click through Ajax. The savings from many thousands of markers, when you take all of that unnecessary info window data out, were fairly large. We were loading around 10,000 markers. The user experience wasn't greatly impacted either because the difference pre-loading and Ajax load times was negligible.

  3. The greatest difference, and perhaps a clue as to where the iOS 7 memory leak lies, came from simply reducing the number of markers displayed on the screen at once. Each application will be different, but we discovered that lowering the results to 500 markers or less resulted in a stable system without crashing. Our strategy was simply to load and clear the array of visible markers based on user behaviour. For example, if the user's particular filter selection resulted in more than 500 markers, we simply limited the results from the database. Visually, the result set still seems large, and is not much different, from a user experience perspective, from seeing many thousands of markers. In both situations, the user will still need to filter and narrow the results to get down to a manageable result. In our case, the user wouldn't even notice the limit.

This did the trick! Our application is now crash free. Considering the amount of time (not to mention frustration!) this issue caused me, hopefully these strategies will give you a jumping off point to get your application back up and working. Feel free to get in touch if you wanted something a little more specific. Good luck!

Upvotes: 3

Jason G
Jason G

Reputation: 309

Good news! we switched over our apps framework from google to leaflet and it works beautifully, no crashing, we checked the debug and it runs extremely high memory but never crashes. If you have not already go with Leaflet, it fully works on iOS 7,

Upvotes: 4

Philipp K&#252;hn
Philipp K&#252;hn

Reputation: 1649

We have a webapplication, that chrashes too with many markers on iOS7. So we took a closer look at the memory the iPad use.

iPad mini (and iPad3) with iOS7:

The memory usage is getting higher and higher and between 300-400MB the browser chrashes.

iPad 3 with iOS6

The memory usage is about 200MB and everything is fine.

iPad 1 with iOS5

The memory usage is only about 100MB and everything is fine.

Conclusion

So this is NOT just a memory limit – it's definitely a huge bug on the iOS safari! And until now (iOS 7.0.3) this is not fixed.

Upvotes: 8

Jan_M
Jan_M

Reputation: 1

We have the same issue with Labels on google map. When map zoom in app get crashed. This started to happen after upgrade in to IOS 7. I am trying different options like remove and add label in events like "drag" and "idle". This code works but still crash occur. but less often. I hope someone might have better fix for this.

    google.maps.event.addListener(Map.gmap, 'drag', function () {
            $('.arrowSite_box').remove(); // remove labels
    });

    google.maps.event.addListener(Map.gmap, 'idle', function () {
        loadMarkers(results); // add labels
    });

Upvotes: 0

nachoorme
nachoorme

Reputation: 534

As said previously iOS7 is more strict with memory usage. This behavior occurs in other browsers like Chrome, so when an app reach upper limit in memory usage, the crash appears.

I have isolated two test cases using only Gmaps javascript API and jQuery:

Testing with 100 markers: Everything it's ok

http://jsfiddle.net/edfFq/6/embedded/result

Testing with 3000 markers: Crash occurs

http://jsfiddle.net/edfFq/7/embedded/result/

$(document).ready(function () {
    var map;
    var centerPosition = new google.maps.LatLng(40.747688, -74.004142);


    var options = {
        zoom: 2,
        center: centerPosition,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    map = new google.maps.Map($('#map')[0], options);


    for (var i=0;i<2800;i++){        
      var position = new google.maps.LatLng(40*Math.random(),-74*Math.random());
      var marker = new google.maps.Marker({
            position: position,
            map: map           
        });
    }
});

You can get the crash with a less number of markers if your map uses: labels, custom icons and clusters.

Upvotes: 13

user2816463
user2816463

Reputation: 1

I had the same problem and tried out a few things. I disabled the animation when markers are set (I had about 30 being added at once) and it seems like it doesn't crash any more now. Hope that helps.

Upvotes: 0

Stefan George
Stefan George

Reputation: 1

I believe IOS7 has a memory cap of 5Mb (longer battery life), it used to be 50Mb or something like that. Since the cap is limited with OS, so it does not matter if you are using Chrome, Safari or other browsers, it will crash if exceeded.

i tested my receiving data limit to 20 from SQL, and it works on all browsers on my iphone (pad).

Upvotes: 0

Related Questions