我正在使用开放网络技术编写一个移动应用程序，主要针对新兴的 Firefox OS，但计划支持任何带有网络浏览器的移动设备。该应用程序涉及公共交通工具，目前在我的城市，但也有能力扩展到其他地区。我想为用户提供公共交通线路站点的图形信息，提供从 A 站到 B 站的最短路线信息，使用城市的公共 API 跟踪车辆位置等。
由于它是一个 Firefox OS 应用程序，我使用 HTML5/CSS3 进行演示，使用 Javascript 进行逻辑，并将这些文件保存在本地，因此应用程序无需访问 Internet 即可运行。但是，我面临的问题是渲染城市地图（顶部可能有叠加层，例如突出显示的道路和车站）。我想让应用程序不依赖互联网连接来工作，因为我想它有时会在运输和公共场合使用，那里不可能有持久的 WiFi 连接，用户必须依赖他们的运营商提供商数据连接，这可能证明成本高昂并转移潜在用户。
到目前为止，我只能找到可以从脱机文件中渲染 OpenStreetMap 数据的Kothic-JS（使用 HTML5 画布），但它的性能让我担心，因为它在我的 Firefox OS 模拟器中卡顿，即使有足够的计算能力可用我的台式电脑。我只能想象它在配备 FxOS 的低端移动设备上会造成怎样的恐惧——我担心该应用程序将无法使用。据我所知，其他库（例如 OpenLayers）倾向于全部下载服务器生成的图块。
使用 HTML5 和 Javascript 在移动设备上渲染城市地图是否可行？我应该如何解决这个问题？地图文件可以使用巧妙的 XSLT 转换为 SVG，也可以预先分割成 SVG 瓦片，在必要时进行裁剪，但这些瓦片的大小永远无法正确选择，因为可以使用大量缩放级别（即，如果缩放级别 5 上的图块占据设备屏幕，在缩放级别 2 上它们只占用设备屏幕的一小部分，我最终绘制了大约 30 个图块来填充屏幕）。除了转向在线服务之外，还有其他方法可以做到这一点吗？我知道有很好的客户端地图渲染库，但这些库都不能在 Javascript 中使用。