Journal3, Webp no support in Safari and LSCache

serpent_driver

serpent_driver

Well-Known Member
#21
#21
I've tested it and can confirm your result. I overlooked that "Safari" is always part of every Mozilla based UA, so my code can't work and have no idea how to solve, sorry.
 
AndreyPopov

AndreyPopov

Well-Known Member
#22
#22
serpent_driver said:
I've tested it and can confirm your result. I overlooked that "Safari" is always part of every Mozilla based UA, so my code can't work and have no idea how to solve, sorry.
Click to expand...
thanks for participation and try to help. great thanks.

I already create ticket, may be tech.specialist can find solution.

and also investigate Journal algorithm to detect Safari and Apple platform
Code: 
        if ($browser->isMobile()) {
            $this->addClass('mobile');
            $this->addClass('phone');
            $this->addClass('touchevents');
            $this->device = 'phone';
        } else if ($browser->isTablet()) {
            $this->addClass('mobile');
            $this->addClass('tablet');
            $this->addClass('touchevents');
            $this->device = 'tablet';
        } else {
            $this->addClass('desktop');
            $this->device = 'desktop';
        }

       switch ($browser->getPlatform()) {
            case Browser::PLATFORM_ANDROID:
                $this->addClass('android');
                break;
            case Browser::PLATFORM_APPLE:
                $this->addClass('mac');
                if ($browser->getBrowser() === Browser::BROWSER_SAFARI) {
                    $this->addClass('apple');
                }
                break;
            case Browser::PLATFORM_IPAD:
                $this->addClass('ipad');
                $this->addClass('ios');
                $this->addClass('apple');
                break;
            case Browser::PLATFORM_IPHONE:
                $this->addClass('iphone');
                $this->addClass('ios');
                $this->addClass('apple');
                break;
            case Browser::PLATFORM_LINUX:
                $this->addClass('linux');
                break;
            case Browser::PLATFORM_WINDOWS:
                $this->addClass('win');
                break;
        }

        // browser detect
        $version = explode('.', $browser->getVersion());
        $version = is_array($version) && count($version) ? $version[0] : '';

        switch ($browser->getBrowser()) {
            case Browser::BROWSER_CHROME:
                $this->addClass('chrome');
                $this->addClass('chrome' . $version);
                $this->addClass('webkit');

                break;
            case Browser::BROWSER_FIREFOX:
                $this->addClass('firefox');
                $this->addClass('firefox' . $version);
                break;
            case Browser::BROWSER_EDGE;
                $this->addClass('edge');
                $this->addClass('ie');
                $this->addClass('ie' . $version);
                break;
            case Browser::BROWSER_IE:
                $this->addClass('ie');
                $this->addClass('ie' . $version);
                break;
            case Browser::BROWSER_OPERA:
                $this->addClass('opera');
                $this->addClass('opera' . $version);
                $this->addClass('webkit');
                break;
            case Browser::BROWSER_SAFARI:
            case Browser::BROWSER_IPHONE:
            case Browser::BROWSER_IPAD:
                $this->addClass('safari');
                $this->addClass('safari' . $version);
                $this->addClass('webkit');
                break;
            default:
                $this->addClass(strtolower(str_replace(' ', '', $browser->getBrowser())));
        }
and think:
Journal use lowercase symbols to detect device, platform and browser.

is difference what lowercase or uppercase symbols in Apache rules?
 
AndreyPopov

AndreyPopov

Well-Known Member
#24
#24
Journal3 check Safari:

Code: 
 protected function checkBrowserSafari()
    {
        if (stripos($this->_agent, 'Safari') !== false
            && stripos($this->_agent, 'iPhone') === false
            && stripos($this->_agent, 'iPod') === false
        ) {

            $aresult = explode('/', stristr($this->_agent, 'Version'));
            if (isset($aresult[1])) {
                $aversion = explode(' ', $aresult[1]);
                $this->setVersion($aversion[0]);
            } else {
                $this->setVersion(self::VERSION_UNKNOWN);
            }
            $this->setBrowser(self::BROWSER_SAFARI);
            return true;
        }
        return false;
    }

and what browser on iPhone, iPad, iPod

Code: 
    protected function checkBrowseriPhone()
    {
        if (stripos($this->_agent, 'iPhone') !== false) {
            $this->setVersion(self::VERSION_UNKNOWN);
            $this->setBrowser(self::BROWSER_IPHONE);
            $this->getSafariVersionOnIos();
            $this->getChromeVersionOnIos();
            $this->checkForFacebookIos();
            $this->setMobile(true);
            return true;

        }
        return false;
    }

    /**
     * Determine if the browser is iPad or not (last updated 1.7)
     * @return boolean True if the browser is iPad otherwise false
     */
    protected function checkBrowseriPad()
    {
        if (stripos($this->_agent, 'iPad') !== false) {
            $this->setVersion(self::VERSION_UNKNOWN);
            $this->setBrowser(self::BROWSER_IPAD);
            $this->getSafariVersionOnIos();
            $this->getChromeVersionOnIos();
            $this->checkForFacebookIos();
            $this->setTablet(true);
            return true;
        }
        return false;
    }

    /**
     * Determine if the browser is iPod or not (last updated 1.7)
     * @return boolean True if the browser is iPod otherwise false
     */
    protected function checkBrowseriPod()
    {
        if (stripos($this->_agent, 'iPod') !== false) {
            $this->setVersion(self::VERSION_UNKNOWN);
            $this->setBrowser(self::BROWSER_IPOD);
            $this->getSafariVersionOnIos();
            $this->getChromeVersionOnIos();
            $this->checkForFacebookIos();
            $this->setMobile(true);
            return true;
        }
        return false;
    }

any ideas what I can add to rules?
 
serpent_driver

serpent_driver

Well-Known Member
#25
#25
Forget it! None of this code will work, because you have 3 functions that try to detect device:

- LiteSpeed
- Journal3
- and this plugin for webp

Every function for device detection works independent from each other. No way to solve it!
 
serpent_driver

serpent_driver

Well-Known Member
#28
#28
Next try. :)

For this next try I setuped a test page and it works with and without Lscache. If It doesn't work for you, it's not my fault. In this case either device detection in OpenCart/Journal3 or Webp plugin has a wrong detection. You can test it on this test page if you have a browser plugin to change user agent.

Notice: Device detection with user agent is high faulty tolerant and can be faked by everyone with browser plugin, so there is no guarantee that such detection works perfect if someone fakes its UA.

Test page: https://www.webp.imedes.de/

***************************************************************

Change the current one:

Apache config: 
RewriteCond %{HTTP_USER_AGENT} "iPhone|iPod|BlackBerry|Palm|Googlebot-Mobile|Mobile|mobile|mobi|Windows Mobile|Safari Mobile|Android|Opera Mini" [NC]
RewriteRule .* - [E=Cache-Control:vary=ismobile]
into:
Apache config: 
# Hint: The current UA entries in Opencart should be redefined in cache plugin for Opencart.
RewriteCond %{HTTP_USER_AGENT} "BlackBerry|Palm|Mobile|mobi|Windows Mobile|Android|Opera Mini|Silk" [NC]
RewriteCond %{HTTP_USER_AGENT} "!Macintosh|Mac OS X|iPhone|iPad|FxiOS" [NC]
RewriteRule .* - [E=Cache-Control:vary=isMobile]
Set a new one for mobile devices with Safari:
Apache config: 
RewriteCond %{HTTP_USER_AGENT} "Mac OS X|iPhone|iPad" [NC]
RewriteCond %{HTTP_USER_AGENT} "Mobile" [NC]
RewriteCond %{HTTP_USER_AGENT} "!Firefox|FxiOS|Opera|BlackBerry|Palm|Trident|Android" [NC]
RewriteRule .* - [E=Cache-Control:vary=isMobileSafari]
And a second for desktop Safari
Apache config: 
RewriteCond %{HTTP_USER_AGENT} "Mac OS X|Macintosh" [NC]
RewriteCond %{HTTP_USER_AGENT} "!Mobile|iPhone|iPad|Opera|FxiOS|BlackBerry|Palm" [NC]
RewriteRule .* - [E=Cache-Control:vary=isDesktopSafari]
 
Last edited:
serpent_driver

serpent_driver

Well-Known Member
#30
#30
! must be between "!". Was wrong in last try.

Bot for Google Mobile has no "Googlebot-Mobile" UA. That's why i marked the current cache-control define for mobile view should to be redefined

The current UA for Google Mobile:

Code: 
Mozilla/5.0 (Linux; Android 6.0.1; Nexus 5X Build/MMB29P) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/41.0.2272.96 Mobile Safari/537.36 (compatible; Googlebot/2.1; +http://www.google.com/bot.html)
 
AndreyPopov

AndreyPopov

Well-Known Member
#31
#31
serpent_driver said:
And a second for desktop Safari
Code: 
RewriteCond %{HTTP_USER_AGENT} "Mac OS X|Macintosh" [NC]
RewriteCond %{HTTP_USER_AGENT} "!Mobile|iPhone|iPad|Opera|FxiOS|BlackBerry|Palm" [NC]
RewriteRule .* - [E=Cache-Control:vary=isDesktopSafari]
Click to expand...

next problem. Google PageSpeed Insights use for desktop test conditions like:
Mac
Desktop
Chrome

in this conditions Journal3 use high res (retina) images webp
what rules for these conditions?
  • Code: 
    RewriteCond %{HTTP_USER_AGENT} "Mac OS X|Macintosh" [NC]
RewriteCond %{HTTP_USER_AGENT} "Chrome" [NC]
RewriteRule .* - [E=Cache-Control:vary=isDesktopRetina]
 
Last edited:
serpent_driver

serpent_driver

Well-Known Member
#32
#32
PageSpeed Insight uses this UA for Desktop:
Code: 
Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/74.0.3694.0 Safari/537.36 Chrome-Lighthouse
This UA has no cache-control like every other non Mac and non Safari desktop device. This is a default setting in OpenCart with Lscache plugin.
 
AndreyPopov

AndreyPopov

Well-Known Member
#33
#33
deeper-deeper investigate - more and more problem find.

yesterday in log find: desktop,googlebot,mozilla - and use jpg :(

even use jpg for all site with LSCache some inconsistency on iPad and iPhone on composition and Main Menu visibility.

I think to try separate cache for:
- iPad
- IPhone|iPod|Safari Mobile
- Android and others


if this variants will work then think about separate cache for others non-webp variants.
 
serpent_driver

serpent_driver

Well-Known Member
#34
#34
That is what I prophesied. 1 faked UA is enough to destroy the best solution, but it is not my fault. My test page works without errors, but also can be faked. This is inherent in the system without any alternative.

You better should reduce the amount to transfered data, but not in better compressed images. Reduce the number of images and number of to be pushed (preloaded) images. More than 350 requests and > 5MB data on your startpage is a "little bit" too much, so it is no wonder that you page is extremely slow. And the network connectivity in your country is also extremely slow. Choose a host in Central Europe with better connectivity.
 
AndreyPopov

AndreyPopov

Well-Known Member
#35
#35
serpent_driver said:
And the network connectivity in your country is also extremely slow. Choose a host in Central Europe with better connectivity.
Click to expand...
95% buyers inside country. not sure that use host in Central Europe will faster.

I want to try separate cache:
Code: 
RewriteCond %{HTTP_USER_AGENT} "iPad" [NC] RewriteRule .* - [E=Cache-Control:vary=isiPadSafari]
RewriteCond %{HTTP_USER_AGENT} "iPhone|iPod" [NC] RewriteRule .* - [E=Cache-Control:vary=isMobileSafari]
RewriteCond %{HTTP_USER_AGENT} "BlackBerry|Palm|Mobile|mobi|Windows Mobile|Android|Opera Mini|Silk" [NC]
RewriteCond %{HTTP_USER_AGENT} "!iPhone|iPad|iPod" [NC]
RewriteRule .* - [E=Cache-Control:vary=isMobile]
right rules?
 
Last edited:
AndreyPopov

AndreyPopov

Well-Known Member
#37
#37
I want to try separate cache:
Code: 
RewriteCond %{HTTP_USER_AGENT} "iPad" [NC] RewriteRule .* - [E=Cache-Control:vary=isiPadSafari]
RewriteCond %{HTTP_USER_AGENT} "iPhone|iPod" [NC] RewriteRule .* - [E=Cache-Control:vary=isMobileSafari]
RewriteCond %{HTTP_USER_AGENT} "BlackBerry|Palm|Mobile|mobi|Windows Mobile|Android|Opera Mini|Silk" [NC]
RewriteCond %{HTTP_USER_AGENT} "!iPhone|iPad|iPod" [NC]
RewriteRule .* - [E=Cache-Control:vary=isMobile]
right rules?
 
serpent_driver

serpent_driver

Well-Known Member
#38
#38
What is about Android devices? Or Opera Mini for mobile? and so on.... Forget it. That can't be solved, because there are 3 functions in your shop that try to detect devices.
 
AndreyPopov

AndreyPopov

Well-Known Member
#39
#39
serpent_driver said:
You can test it. Download https://sourceforge.net/projects/winmtr/. Execute WinMTR.exe and enter domain name or IP of your server and let it run a few minutes. Stop it, export result and post it.
Click to expand...
Code: 
|------------------------------------------------------------------------------------------|
|                                      WinMTR statistics                                   |
|                       Host              -   %  | Sent | Recv | Best | Avrg | Wrst | Last |
|------------------------------------------------|------|------|------|------|------|------|
|cs-central-router.computersystemsltd.com -    0 |  445 |  445 |    0 |    0 |    3 |    0 |
|        cs-trifle.computersystemsltd.com -    0 |  445 |  445 |    0 |    0 |   12 |    0 |
|                   unknown.dne.volia.net -    0 |  445 |  445 |    0 |    0 |   11 |    0 |
|                   unknown.dne.volia.net -    0 |  445 |  445 |    1 |    3 |  152 |    1 |
|   te0-2-0-9.833.cr-1.g50.kiev.volia.net -    0 |  445 |  445 |    8 |    8 |   63 |    9 |
|         be3.180.cr-2.g50.kiev.volia.net -    0 |  445 |  445 |    7 |    8 |   52 |    8 |
|            37-249-179-213.ip.ukrtel.net -    0 |  445 |  445 |    7 |   18 |  140 |    7 |
|                   No response from host -  100 |   90 |    0 |    0 |    0 |    0 |    0 |
|          126-129-132-95.pool.ukrtel.net -    0 |  445 |  445 |    8 |   10 |   66 |    8 |
|                   sw90.default-host.net -    0 |  445 |  445 |   10 |   26 |  120 |   27 |
|                 web379.default-host.net -    0 |  445 |  445 |    8 |    8 |   15 |    8 |
|________________________________________________|______|______|______|______|______|______|
   WinMTR v0.92 GPL V2 by Appnor MSP - Fully Managed Hosting & Cloud Provider

serpent_driver said:
What is about Android devices? Or Opera Mini for mobile?
Click to expand...
on Android LSCache Mobile View work correctly and really reduce server response.



browsers_stattistics_04.jpg
 
Last edited:
serpent_driver

serpent_driver

Well-Known Member
#40
#40
Check "Wrst" column. There are many hosts with a high rate of data loss. Either your host company has bad peerings or your own network connect into the Internet is bad. To find out which one is bad this test must be done again, but from your server to your PC, but that needs access to CLI.

Anyway, my advice is reduce the number of items and images in listings and startpage. This will speedup your page more as a few kb with webp images. 350 requests and > 5MB is toooooooooooooooo much!
 
You must log in or register to reply here.
Top