Tengo un pequeño problema con Safari: cuando quiero actualizar la posición de un elemento DOM en el evento de desplazamiento, Safari parece no ponerse al día con los cambios (lo que resulta en un efecto de retraso). Lo comprobé en otros navegadores (Chrome, FF, IE8 +) y esto parece ser específico de Safari.

Hice un jsfiddle para ilustrar mi problema:

$("#container").on("scroll", function() {
    $("#slide").css({
        left: $("#container").scrollLeft() + "px"
    });

    var leftPos = 0;
    for(var i = 0; i < 2000 ; i++) {
        leftPos = $("#slide").css("left");
    }  
    $("#info").text(leftPos); 
});

http://jsfiddle.net/a4b86et3/2/

Como puede ver, agregué un ciclo adicional de lectura DOM en cada desplazamiento para simular "más operaciones en curso" en cada evento, ya que este mecanismo es parte de un proyecto más grande, que contiene muchas otras operaciones DOM. (Tenga en cuenta que este ejemplo funciona sin problemas en todas partes excepto Safari)

Además, usé jQuery solo por conveniencia, el proyecto real usa js puro.

Me las arreglé para solucionar parcialmente el problema

cambiando elleft = x propiedad atransform = translate3d(x,0,0), por lo que el navegador usaría la GPU.

$("#container").on("scroll", function() {
    $("#slide").css({
        '-webkit-transform': 'translate3d(' + $("#container").scrollLeft() + 'px, 0, 0)'
    });

    var leftPos = 0;
    for(var i = 0; i < 1900 ; i++) {
        leftPos = $("#slide").css("left");
    }  
    $("#info").text(leftPos);

});

http://jsfiddle.net/a4b86et3/3/

Sin embargo, a veces sigo experimentando un ligero retraso / falla mientras me desplazo.

Pero lo que es más importante, esta solución no afecta el desplazamiento, cuando estoy usando un mouse mouse o touchpad! Si bien arrastrar la barra de desplazamiento funciona mucho mejor, usar cualquiera de los anteriores me devuelve a mi problema inicial.

¿Alguna idea de por qué sucede esto y cómo solucionarlo?

tl; dr; - Safari es lento al cambiar la posición del elemento en el desplazamiento; parece que translate3d no funciona correctamente cuando se utiliza el mouse scroll / touchpad.