jQuery Mobile 和 Google Maps API v3 内存泄漏答案

【问题标题】：jQuery Mobile and Google Maps API v3 memory leakjQuery Mobile 和 Google Maps API v3 内存泄漏
【发布时间】：2012-02-09 22:12:20
【问题描述】：

我有一个使用 jQuery Mobile 1 和 Google Maps API v3 的移动网络应用程序。在 jQuery Mobile 中加载 Google 地图时，似乎存在严重的内存泄漏。当用户离开地图页面时，谷歌地图占用的内存不会被释放。因此，当用户返回地图页面时，内存使用量不断增长。这在移动网络浏览器上尤其是一个大问题。我在 Android 和桌面版 Chrome 上测试了以下内容。泄漏的触发方式如下：

导航到：http://www.mycoursewalk.com/mobile_course_walk/show/25

点击“查看课程”，让地图完全加载。然后点击浏览器的后退按钮或左下角的后退按钮。重新单击“查看课程”并让地图完全加载。重复。每次加载地图时，您都会看到 Chrome 或移动浏览器的进程增加了大约 30MB。

我该如何解决这个问题？我找不到地图 API 卸载。

谢谢，

尼克，

【问题讨论】：

标签： memory-leaks jquery-mobile google-maps-api-3

【解决方案1】：

我认为您每次都调用 createMap 而不是检查地图是否已经存在并重新使用该对象。

试试这样的：

var mapDisplay = {                                                                                                                                                               
    mapCreated : false,
    init: function() {
      //some init stuff
    },
    showMap: function() {
        if(!mapDisplay.mapCreated) {
            mapDisplay._createMap();
            mapDisplay.mapCreated = true;
        }
        $("#my_map").show();
        $('#my_map').gmap('refresh');                                                                                                                                  
    },
    _createMap : function() { 
        //options would be a json config object
        $('#my_map').gmap(options);
    },
    //all the other methods you need
}

这将与 this jQuery gmap demo application 中使用的库一起使用

【讨论】：