问题
I have been working for a long time on one particular problem to make an svg image that can be dragged and zoomed using gestures on a mobile.
I use hammer.js to detect gestures and my current implementation works as follows.
When a drag is detected the SVG element is transformed using a (-webkit-)transform with a matrix3d value. Upon completion of the gesture the new viewbox is calculated and the transform is returned to the identity matrix.
When a pinch is detected SVG element is zoomed using a (-webkit-)transform with a matrix3d value. Upon completion of the gesture the new viewbox is calculated and the transform is returned to the identity matrix.
To further improve performance the attribute changes are applied inside request animation frame calls.
What this means is that when zooming in the image will raster during the zoom and then there will be a small delay and it will be re-rendered clearly when the viewbox calculations complete.
The whole purpose of this involved process is so that the transformation/zooming during the gesture can be done using the GPU and have a smooth user experience.
What I want to be able to do is check if a particular transformation was pushed to the gpu or not?
For example this page runs the code I described above. On most desktop browsers it works fine but that is because the desktop performance means that there is no noticeable lag even if the image is re-rendered constantly.
The interesting behaviour happens on mobile. When I use this page in browser on my android phone the dragging and zooming is smooth. When I open the same page on the same phone but in chrome the animation is much less smooth. The image rasters on both when zooming in and so what I want to be able to do is check if chrome is using the hardware for that transformation. I want to use the hardware across as many browsers as possible but this question is about checking whether I was successful in doing that.
来源：https://stackoverflow.com/questions/25282715/check-when-css-transforms-are-executed-using-hardware-acceleration