AddOutputFilterByType DEFLATE text/text text/html text/plain text/xml text/css application/x-javascript application/javascript text/javascript
Ok pls let Arlex investigate this and also share why this doesnt work..
<script src="https://site.com/media/com_easysocial/scripts/site-3.2.24.min.js" async></script>
<script type="text/javascript">
//<![CDATA[
EasySocial.module("init", function($) {
this.resolve();
}).done();
//]]>
</script>
setTimeout(() => {
//here is the script
}, 1000)
So for me, the most important questions is:
What is the minimum we need to include in the js file to get the site to render.
Anything else, from swipers to notifications, should be packaged into a seperate .js file, which can then be deferred and loaded asyc. This will also benefit logged in users, where page loading speeds are always an issue.
Maybe that's something that the Stackideas team can look into?
public function createScriptTag($path)
{
function isBot(){
$bots = array(
'Google PageSpeed Insights','Googlebot','Chrome-Lighthouse'
foreach($bots as $bot)
if(stripos($_SERVER['HTTP_USER_AGENT'], $bot) !== false){
return true;
}
return false;
}
if( isBot() ) {
// script for bot
$script = '<script' . (($this->defer) ? ' defer' : '') . (($this->async) ? ' async' : ' async') . ' src="' . $path . '"></script>';
} else {
$script = '<script' . (($this->defer) ? ' defer' : '') . (($this->async) ? ' async' : '') . ' src="' . $path . '"></script>';
}
self::$attachedTags[] = $script;
return $script;
}
Hi
When really want high performance in google pagespeed:D
For google robots - asynchronous, for users without async
public function createScriptTag($path)
{
function isBot(){
$bots = array(
'Google PageSpeed Insights','Googlebot','Chrome-Lighthouse'
foreach($bots as $bot)
if(stripos($_SERVER['HTTP_USER_AGENT'], $bot) !== false){
return true;
}
return false;
}
if( isBot() ) {
// script for bot
$script = '<script' . (($this->defer) ? ' defer' : '') . (($this->async) ? ' async' : ' async') . ' src="' . $path . '"></script>';
} else {
$script = '<script' . (($this->defer) ? ' defer' : '') . (($this->async) ? ' async' : '') . ' src="' . $path . '"></script>';
}
self::$attachedTags[] = $script;
return $script;
}
But this is certainly not the solution. File min.js is actually huge, for mobile, you will not be able to get out of the red zone for all pages, for example, for album pages. async and defer not help. You need to significantly reduce the size, this is exactly the case when several files will be more efficient than one huge one min.js.
Ideally, there should be light scripts versions for guest visitors, including Google.
Because most javascript features are not enabled for Guests.
Lol this is a good idea to trick the google crawler but you are definitely right, it is not a good solution for this and it is not easy to split out the Javascript code from the minify .js file currently.
We will see if we can figure out a better solution for this.
Ideally, there should be light scripts versions for guest visitors, including Google.
Because most javascript features are not enabled for Guests.
The swiper issue will be fixed on beta 3
@krill. Can you take a lead on this?
Cheers!
Another way is to use several JS file instead one. And disable file if disabled feature. For example:
1) site.js – common and lite necessary JS-file that will make work website with minimum of features
2) events.js – it will load only if Event feature is enabled on site.
3) pages.js (cluster.js) – it will load only if Pages / groups / features is enabled on site.
4) marketplace.js – it will load only if Marketplace feature is enabled on site.
5) videos.js – it will load only if Event feature is enabled on site.
6) polls.js – it will load only if Polls feature is enabled on site.
7) photos.js – it will load only if Event feature is enabled on site.
8) audio.js – it will load only if Audio feature is enabled on site.
9) sharer.js – it will load only if Sharer feature is enabled on site.
10) social.js – it will load only if Social Integrations feature is enabled on site.
11) conversations.js – it will load only if Conversations feature is enabled on site.
12) location.js – it will load only if Location feature is enabled on site.
13) socialbookmarking.js – it will load only if Social Bookmarking feature is enabled on site.
14) reporting.js – it will load only if Reporting feature is enabled on site.
etc.
For example I don't use Audio, Marketplace, Events, Pages, Advertisement and much more.
May be you think that 10+ mini JS-files is worse that 1 bigger file? I don't think so. Anyway EasySocial can combine/compress them in one (only those file that you need). ? Or use 3party extension.
The same feature realist for modules. Every single module should use it's own mini JS-file and don't use huge /media/com_easysocial/scripts/site-3.2.17.min.js
If I publish on standard Joomla article page one ES module I don't need to load this site-3.2.17.min.js for example.
May be the same should be with CSS files. I don't know.
Note:
My dashboard EasySocial page loads 7.76+ sec. ?
My homepage (Non EasySocial page) without any EasySocial modules loads 1.49+ sec. ? If I publish on this-homepage any ES module it start to load big script and homepage become slowly.
I can see that EasySocial 4 use the same method as EasySocial 3. But JS and CSS files become bigger.
And interested: if I don't use events, pages, audio, etc. Can I edit main JS-file and delete parts of codes related to events, pages, audio to make file less? Thanks.
Maybe a simple way is to use a "reduced size" js file when lockdown mode is selected.
EasySocial lockdown mode is designed to prevent any guest from seeing community content, but allowing them to register on the site. That means that no EasySocial info apart from the sign-in/ registration page or module will be used in public mode.
Can we not create a JS file with only that functionality, then amend ES so that this file is loaded instead when lockdown is enabled and guest is not logged in?
This way we can significantly reduce the JS file size for lockdown mode and not have to do major issues with ES for all the other variations, where lockdown is not used or required?