hammertime | software suite for testing , profiling

I've noticed when using Hammer-time.js for zoom events that there is a noticeable lag in the pinch zoom event if you go from pinch in to pinch out (or vice versa) without taking your fingers off the screen.

I have only tested this on Android as I only have an Android phone and tablet available.

Often the zoom will continue to go in before turning around and going out again even though the user has reversed the action. Its obvious when zooming into something like a photograph using this method.

The jQuery code I am using is as simple as I can make it for the demonstration:

I have a hosted website which uses Hammer.js for swipe functions. The swipe functions works fine in both desktop and mobile browsers but does not work on Cordova InAppBrowser (cordova-plugin-inappbrowser).

Cordova application:

I'm using Hammer.js (v2.0.8) to show the left menu but I also have a carousel in the same page (with owl carousel v2.3.4). When I slide the carousel, the menu open too. I try Hammer.off() but he doesn't work.

This is the Hammer event (in the global js so for all pages):

thats my full js code:

I am using HammerJS with Angular 4 application for pinch zoom an image. In hammerJS doc it is mentioned by default pinch zoom is set to off and the code to turn it on is

How is possible to achieve hovering effect over elements in container via pan gesture?

HTML:

I need to build a kind of map in canvas, which must be able to hold more than 10.000 elements and thus has quiet big dimensions in some cases (> 8000px width, >4000 px height). Also I need to pan and zoom the map. After some fiddeling around with existing libraries (Paper.js) and possible other solutions (Leaflet Map) I eventually wrote an own library from scratch, because the main requirement is, that is should be really really fast (loading, mouseovers, ...) and none of the libraries I tried could offer all of the aspects.

The structure is as follows:

• I have one map object with an associated Control object, which registers events and has resize methods etc.
• A map is divided in mutliple even sized tiles (1024px x 1024px - customizable) because using the map with only one canvas at a size over 8000px width made it incredibly slow
• Each tile is associated with a canvas
• The elements (just circles) are added to one or multiple tiles (If it's on the edge) - more specifically to the tiles' canvas.
• The tiles are placed within an container div which has the dimensions of the map area (when not zoomed out)
• The container div is placed within a viewport div to enable the map being displayed as a "widget"
• Zooming scales every tile/canvas and the container. For sake of performance I sacrificed smooth zoom and implemented a customizable amount of zoom steps, which still feels okay.
• Panning set's the topand left style of the container.
• Events used are window.resize, mousewheel, DOMMouseScrol, mousedown, mouseup, mousemove, touchstart,touchend,touchmove and Hammertime pinch

This alltogether runs satisfying on Desktop Browsers, and iPhones (tested with SE, 6S) but on every Android device I tested it (Samsung S4, One Plus One and another 1 year old device, and android studio emulator) it runs extremly slow. Drawing of the Map is fine in speed, but zooming and panning is near to impossible.

The code is too comprehensive to post it here, so I'm asking you if there are any known problems with canvas on android, that could explain this problem, or maybe some issues with the way I built the structure that could produce issues with android. I'm really clueless here, since it works on desktop and iPhone.