Jquery UI Sortable jerky behaviour with MCustomScrollbar

Question

I have implemented jQuery UI sortable in my project. In my implementation I have large number of records which around 10,000 at an average. I store the index of each record in my database.

The implementation is working fine but due to mCustomScrollbar, the sorting feature is very jerky. The scrolling do not work properly when I reach last visible record. I have created a sample of my implementation here.

Is there any property in mcustomscrollbar that I am missing. I used below code for custom scrollbar:

<script>
    (function($){
        $(window).on("load",function(){

            /* call mCustomScrollbar function before jquery ui sortable() */

            $("#sortable").mCustomScrollbar({
                scrollbarPosition:"outside",
                scrollInertia:450,
                theme:"light-2"
            });

            $("#sortable ul").sortable({
                axis:"y",
                cursor:"move",
                tolerance:"intersect",
                change:function(e,ui){
                    var h=ui.helper.outerHeight(true),
                        elem=$("#sortable .mCustomScrollBox"),
                        elemHeight=elem.height(),
                        moveBy=$("#sortable li").outerHeight(true)*3,
                        mouseCoordsY=e.pageY-elem.offset().top;
                    if(mouseCoordsY<h){
                        $("#sortable").mCustomScrollbar("scrollTo","+="+moveBy);
                    }else if(mouseCoordsY>elemHeight-h){
                        $("#sortable").mCustomScrollbar("scrollTo","-="+moveBy);
                    }
                }
            });

        });
    })(jQuery);
</script>

UPDATE

I have also implemented Kendo Sortable along with perfect scrollbar but it is also not working. Plunker link with Kendo Sortable is here