From 353fc399224618be26b10a76d5e6333bccb890a7 Mon Sep 17 00:00:00 2001
From: Liviu Cristian Mirea Ghiban <contact@liviucmg.com>
Date: Mon, 29 Aug 2016 19:25:28 +0300
Subject: [PATCH] Improve performance by using translateY instead of top.
 Properly get sidebar width.

---
 js/theia-sticky-sidebar.js | 33 ++++++++++++++++++++++++++-------
 1 file changed, 26 insertions(+), 7 deletions(-)

diff --git a/js/theia-sticky-sidebar.js b/js/theia-sticky-sidebar.js
index 38e4e38..aa53db5 100755
--- a/js/theia-sticky-sidebar.js
+++ b/js/theia-sticky-sidebar.js
@@ -32,7 +32,7 @@
             var success = tryInit(options, $that);
 
             if (!success) {
-                console.log('TST: Body width smaller than options.minWidth. Init is delayed.');
+                console.log('TSS: Body width smaller than options.minWidth. Init is delayed.');
 
                 $(document).scroll(function (options, $that) {
                     return function (evt) {
@@ -258,9 +258,10 @@
                     if (position == 'fixed') {
                         o.stickySidebar.css({
                             'position': 'fixed',
-                            'width': o.sidebar.width(),
-                            'top': top,
-                            'left': o.sidebar.offset().left + parseInt(o.sidebar.css('padding-left'))
+                            'width': getWidthForObject(o.stickySidebar) + 'px',
+                            'transform': 'translateY(' + top + 'px)',
+                            'left': (o.sidebar.offset().left + parseInt(o.sidebar.css('padding-left'))) + 'px',
+                            'top': '0px'
                         });
                     }
                     else if (position == 'absolute') {
@@ -268,10 +269,11 @@
 
                         if (o.stickySidebar.css('position') != 'absolute') {
                             css.position = 'absolute';
-                            css.top = scrollTop + top - o.sidebar.offset().top - o.stickySidebarPaddingTop - o.stickySidebarPaddingBottom;
+                            css.transform = 'translateY(' + (scrollTop + top - o.sidebar.offset().top - o.stickySidebarPaddingTop - o.stickySidebarPaddingBottom) + 'px)';
+                            css.top = '0px';
                         }
 
-                        css.width = o.sidebar.width();
+                        css.width = getWidthForObject(o.stickySidebar) + 'px';
                         css.left = '';
 
                         o.stickySidebar.css(css);
@@ -315,7 +317,8 @@
                     });
                     o.stickySidebar.css({
                         'position': 'static',
-                        'width': ''
+                        'width': '',
+                        'transform': 'none'
                     });
                 }
 
@@ -331,5 +334,21 @@
                 }
             });
         }
+        
+        function getWidthForObject(object) {
+            var width;
+            
+            try {
+                width = object[0].getBoundingClientRect().width;
+            }
+            catch(err) {
+            }
+            
+            if (typeof width === "undefined") {
+                width = object.width();
+            }
+            
+            return width;
+        }
     }
 })(jQuery);