[SLING-8283] httpGet in system/sling.js uses deprecated main thread blocking code

• Type: Improvement
• Status: Closed
• Priority: Major
• Resolution: Fixed
• Fix Version/s: Servlets Post 2.3.30, Starter Content 1.0.4
• Component/s: Best practices, Servlets
• Assignee: Unassigned
• Reporter: Ruben Reusser
• Created: 19/Feb/19 14:15
• Updated: 20/May/19 06:53
• Resolved: 07/Mar/19 09:06

Description

the sling starter homepage throws the following error in the browser console.

sling.js:75 [Deprecation] Synchronous XMLHttpRequest on the main thread is deprecated because of its detrimental effects to the end user's experience. For more help, check https://xhr.spec.whatwg.org/.

As the error mentions this is due to the fact that sling is using main thread blocking calls in /system/sling.js - this is generally not recommended anymore as it blocks the ability for a user to interact with the browser

The problem can easily be solved by using callbacks instead of main thread blocking code. 

by altering Sling.httpGet to support callbacks this change can be made gradually over time without a break in backwards compatibility

 

/**
 * HTTP GET XHR Helper
 * @param {String} url The URL
 * @param {Function} optional second parameter for async version of the method.
 *        The callback will get the XHR object, method returns immediately
 * @return the XHR object, use .responseText for the data
 * @type String
 */
Sling.httpGet = function(url, callback) {
    var httpcon = Sling.getXHR();
    if (httpcon) {
        if(callback) {
            httpcon.onload = function() { callback(this); };
            httpcon.open('GET', url);
            httpcon.send(null);
        } else {
            httpcon.open('GET', url, false);
            httpcon.send(null);
            return httpcon;
        }
    } else {
        return null;
    }
}

Issue Links

• relates to: SLING-8278 improve chrome audit score
• links to: GitHub Pull Request #4