Perfeccionar codigo para hacerlo mas eficiente

[AitorLopez]

Hola.

Vaya por delante que mis conocimientos de javascript y jquery son regulares.

Tengo una pagina que al pulsar guardar, va al servidor, realiza operaciones, se trae los datos y despues hace esto:

Código Javascript:

$( 'html, body' ).animate({
                opacity: 0,
            }, 1, function() {
        $( 'html, body' ).animate({
                scrollTop : posicionar,
                behavior: 'smooth',
            }, 1, function(){
        $( 'html, body' ).animate({
                opacity: 1,
            }, 1000)
            })
        });
 

La idea es que el scroll se situe donde el valor de la variable "posicionar" sin que se note con un efecto fade. Es decir, al entrar en la pagina, que ya haga el fade y que vuelva cuando esté posicionado. Así de esta forma el usuario solo ve que se le ha vuelto a posicionar donde pulsó guardar.

Este código está funcionando relativamente bien, pero en alguna ocasion se ve un poco como baja el cursor.

La idea es que algun experto como vosotros me de alguna idea de como se puede optimizar este trozo de código para que funcione perfecto.

Muchas gracias.

Un saludo.

[Alexis88]

Podrías obtener un resultado más pronto si directamente ocultas el contenido desde la hoja de estilos y en la función que se ejecuta al completarse el efecto en el método .animate() efectúas el cambio respectivo para que el contenido vuelva a ser visible; o bien puedes utilizar el método .scroll() para realizar el desplazamiento sin efectos de transición.

Código CSS:

body{
    opacity: 0;
}
 
.show{
    opacity: 1;
}
 

Código Javascript:

window.scroll(0, posicionar);
document.body.className = "show";