webcompat / web-bugs

A place to report bugs on websites.
https://webcompat.com
Mozilla Public License 2.0
746 stars 66 forks source link

www.grupodelrey.com.br - Very slow page load #125671

Open webcompat-bot opened 1 year ago

webcompat-bot commented 1 year ago

URL: https://www.grupodelrey.com.br/linhas

Browser / Version: Firefox Mobile 116.0 Operating System: Android 13 Tested Another Browser: Yes Chrome

Problem type: Site is not usable Description: Page not loading correctly Steps to Reproduce: It's Slowly to open. +60sec. Sometimes don't open. Site riquires "cookies". Totally instable.

View the screenshot Screenshot
Browser Configuration
  • gfx.webrender.all: false
  • gfx.webrender.blob-images: true
  • gfx.webrender.enabled: false
  • image.mem.shared: true
  • buildID: 20230805021307
  • channel: release
  • hasTouchScreen: true
  • mixed active content blocked: false
  • mixed passive content blocked: false
  • tracking content blocked: false

View console log messages

From webcompat.com with ❤️

sv-calin commented 1 year ago

Thank you for reporting this issue, I was able to reproduce it. The page loads really slow compared to Chrome.

image

Tested on: • Browser / Version: Firefox Focus 116.0.2-20230805021307 / Firefox Nightly 118.0a1-20230810094725 / Firefox Release 116.0.2-20230805021307 / Chrome 115.0.5790.136 • Operating System: Google Pixel 5 (Android 13) - 1080 x 2340 pixels, 19.5:9 ratio (~432 ppi density)

Notes:

  1. Reproducible on both Firefox Release and Nightly
  2. Private mode and ETP settings seems to affect the load time even more
  3. Not reproducible on Chrome

Moving to Needsdiagnosis.

[qa_32/2023]

ksy36 commented 1 year ago

@sv-calin wonder if you could record a perf profile, please?

sv-calin commented 1 year ago

Performance profile: https://share.firefox.dev/47BV7Ed

Note: Captured with Standard ETP

Tested on: • Browser / Version: Firefox Nightly 118.0a1-20230816094547 • Operating System: Google Pixel 5 (Android 13) - 1080 x 2340 pixels, 19.5:9 ratio (~432 ppi density)

[inv_33/2023]

ksy36 commented 10 months ago

The site is attempting to parse css and apply some modifications to it and it ends up in an endless loop:

        //read style tags
        $("style").each(function(){
            var conts=$(this).html();
            readCss(conts,"background",false);
        });
        //@param: path - path which to make the urls change to (false to disable)
        function readCss(conts,prop,path){
            var output={};
            //get rid of comments
            conts=conts.replace(/\/\*([^*]|[\r\n]|(\*+([^*/]|[\r\n])))*\*+\//g,'');
            var pos=conts.indexOf(prop);
            //loop through all backgrounds in the stylesheet
            while(pos>-1){
                var bgVal=replaceWithLower($.trim(conts.substr(conts.indexOf(":",pos+1)+1,conts.indexOf(";",pos+1)-conts.indexOf(":",pos+1)-1)),"url(");

                //only do anything if there are actually multiple bgs in the property

                bgVal=replaceInnerComma(bgVal);
                if(bgVal.indexOf(",")>-1){

                    //make paths relative to the stylesheet work out
                    if(path){
                        var urlPos=bgVal.indexOf("url(");
                        while(urlPos>-1){
                            //don't do any working on absolute urls
                            if(bgVal.substr(urlPos+4,7).toLowerCase()!="http://"){
                                var extraSlash=(bgVal.substr(urlPos+4,1) == '/');
                                var domain=document.URL.substr(0,document.URL.indexOf('/',9));
                                bgVal=bgVal.substr(0,urlPos+4)+(extraSlash ? domain :path)+bgVal.substr(urlPos+4);
                            };
                            //seek to next
                            urlPos=bgVal.indexOf("url(",urlPos+1);
                        };
                    };

                    //determine if there was an important in this bg value
                    var important=bgVal.length;
                    bgVal=bgVal.replace("!important","");
                    important=(important==bgVal.length ? false : true);
                    var prevBrace=conts.lastIndexOf("}",pos)+1;
                    //Allow for charset 
                    if(conts.lastIndexOf(";",pos)+1>prevBrace) prevBrace=conts.lastIndexOf(";",conts.lastIndexOf("{",pos))+1;
                    if(prevBrace==-1) prevBrace=0;
                    var selector = $.trim(conts.substr(prevBrace,conts.lastIndexOf("{",pos)-prevBrace));
                    //account for multiple selectors
                    var selSplit=selector.split(",");
                    for(var i=0;i<selSplit.length;i++){
                        var curSel=$.trim(selSplit[i]);
                        curSel=replaceWithLower(curSel,":active");
                        curSel=replaceWithLower(curSel,":hover");
                        curSel=replaceWithLower(curSel,":focus");

                        output[curSel]={property:prop,value:bgVal,selScore:selectorScore(curSel,important)};
                    };
                };

                pos=conts.indexOf(prop,conts.indexOf(";",pos+1));
            };
            //put the contents into the storage
            $.extend(myCss,output);
        };
        //find lower/uppercase combinations and replace with lowercase for compatability
        function replaceWithLower(inStr,replaceWith){
            var linStr=inStr.toLowerCase();
            var pos=linStr.indexOf(replaceWith);
            while(pos>-1){
                inStr=inStr.substr(0,pos)+replaceWith+inStr.substr(pos+replaceWith.length);
                pos=linStr.indexOf(replaceWith,pos+1);
            };
            return inStr;
        };

It only happens in Firefox because of the incorrect UA detection :

    //conditional for which browsers you want to support (ie6/7/8,firefox<=3.5)
    if(($.browser.msie && parseFloat($.browser.version)>=6 && parseFloat($.browser.version)< 9)||
       ($.browser.mozilla && parseInt($.browser.version.substr(0,1))<=1 && parseInt($.browser.version.substr(2,1))<=9 && parseInt($.browser.version.substr(4,1))<=1)){

Capping the rv part of UA to 99 Mozilla/5.0 (Macintosh; Intel Mac OS X 10.15; rv:99.0) Gecko/20100101 Firefox/123.0 makes it so the above condition doesn't pass and the parsing script is not run, similarly to Chrome. We can add a sitepatch here for both mobile and desktop and contact the site

ksy36 commented 10 months ago

Performance profile: https://share.firefox.dev/47BV7Ed

Note: Captured with Standard ETP

Tested on: • Browser / Version: Firefox Nightly 118.0a1-20230816094547 • Operating System: Google Pixel 5 (Android 13) - 1080 x 2340 pixels, 19.5:9 ratio (~432 ppi density)

[inv_33/2023]

thanks for the profile!