XF 1.5 Intermittent Styling Issues

[anmol dubey]

Hello Guys,

Seeing intermittent issues with displays in my forum. I had raised this earlier but it is intermittent.

See the styling is screwed up in below screen . Any suggestions what may be going wrong?



I am also seeing issues sometime on my home/forum main page where all styling goes haywire randomly. It gets solved if i uninstall/install an addon.

May be after a template rebuild - Can we rebuid the template manually?

 

[anmol dubey]

@Chris D @Mike

 

[Chris D]

There's a lot of stuff happening on your pages and it's difficult to say which one is causing this particularly.

There are a lot of ads, there's a push notifications thing, there's a chat system and I think you have mod_pagespeed enabled.

Ultimately, I would recommend disabling all of these to see if the issue goes away. If it does, re-enable each one until the issue comes back.

I'm especially suspicious of the pagespeed stuff, because that does appear to be doing stuff to the JS and CSS URLs (the CSS URLs seem to work but they're in a pretty crazy format) so I would perhaps start there first.

 

[anmol dubey]

@Chris D Thanks for your inputs. Is there a process to rebuild templates manually. It does happen when an addon is installed or uninstalled. Can it be done manually?

 

[Chris D]

I don't believe it's related and I don't believe it would help.

You could rebuild master data by going to the install system.

 

[EQnoble]

If you are using mod_pagespeed you should manually set the directives that are being applied to your pages.

What are your current directives?

 

[TPerry]

The MOST likely culprit is mod_pagespeed.
I know I've played with it numerous times.. there was just way to much tweaking involved in the exclusions that you had to do. Try disabling that first and see if it resolves your issue.
If you are running ads from different networks, then you will have to further tweak the pagespeed config file for them also.

This is one that EVA2000 uses with his CentMin Mod stack.. but even with it, it was taking some extra tweaking to get to work on my site (since no site is the same)

pagespeed on;

pagespeed LoadFromFile "http://yourdomain.com" "/home/nginx/domains/yourdomain.com/public";
pagespeed LoadFromFile "https://yourdomain.com" "/home/nginx/domains/yourdomain.com/public";

pagespeed LoadFromFileRuleMatch disallow .*;
pagespeed LoadFromFileRuleMatch allow \.css$;
pagespeed LoadFromFileRuleMatch allow \.jpe?g$;
pagespeed LoadFromFileRuleMatch allow \.png$;
pagespeed LoadFromFileRuleMatch allow \.gif$;
pagespeed LoadFromFileRuleMatch allow \.js$;

pagespeed Disallow */js/dark/postrating.js*;
pagespeed Disallow */js/xenforo/tabalerts.js*;
pagespeed Disallow */lost-password/lost;
pagespeed Disallow */lost-password/*;
pagespeed Disallow */payment_callback.php*;
pagespeed Disallow */munin/*;
pagespeed Disallow */admincp/*;
pagespeed Disallow */cron.php*;
pagespeed Disallow */admin.php*;
pagespeed Disallow */css.php*;
pagespeed Disallow */js/jquery/jquery-1.11.0.min.js*;
pagespeed Disallow */js/xenforo/xenforo.js*;
pagespeed Disallow */mark-read*;
pagespeed Disallow */forums/-/mark-read*;
pagespeed Disallow */reply/preview*;
pagespeed Disallow */account/alerts-popup*;
pagespeed Disallow */conversations/popup*;
pagespeed Disallow */conversations/*;
pagespeed Disallow */account/alerts/*;
pagespeed Disallow */?card*;
pagespeed Disallow */misc/quick-navigation-menu*;
pagespeed Disallow */misc/update-cache-ttl*;
pagespeed Disallow */deferred.php*;
pagespeed Disallow */forums/*;
pagespeed Disallow */attachments/*;
pagespeed Disallow */rgba.php*;
pagespeed Disallow */add-reply*;
pagespeed Disallow */edit-inline*;
pagespeed Disallow */save-inline*;
pagespeed Disallow */posts/*/save-inline*;
pagespeed Disallow */posts/*/edit*;
pagespeed Disallow */posts/*/delete*;
pagespeed Disallow */posts/*/ip*;
pagespeed Disallow */posts/*/report*;
pagespeed Disallow */proxy.php*;

#######################################################
# File cache settings
######################################
# needs to exist and be writable by nginx

# pagespeed FileCacheSizeKb          102400;
# pagespeed FileCacheCleanIntervalMs 3600000;
# pagespeed FileCacheInodeLimit      500000;

#######################################################
# Set it to 0 if you want to disable this feature.
pagespeed MessageBufferSize 100000;

#######################################################
# By default, ngx_pagespeed adds an X-PageSpeed header with a value of the version of
# ngx_pagespeed being used. This directive lets you specify the value to use instead:
# pagespeed XHeaderValue "ngx_pagespeed";

#######################################################
# let's speed up PageSpeed by storing it in the super duper fast memcached
# Ensure Memcached server installed http://centminmod.com/memcached.html
# default install for centmin mod is on port 11211, so localhost:11211 is correct
# uncomment - remove hash # in front of below 2 lines to enable
# timeout set at 100 milliseconds
  pagespeed MemcachedThreads 1;
  pagespeed MemcachedServers "localhost:11211";
  pagespeed MemcachedTimeoutUs 100000;

#######################################################
## https://developers.google.com/speed/pagespeed/module/admin#virtual-hosts-and-stats
######################################
# pagespeed UsePerVhostStatistics on;

#######################################################
## 1.7.30.1 beta defaults
######################################
pagespeed PreserveUrlRelativity on;
pagespeed MaxCombinedCssBytes -1;
pagespeed ImageResolutionLimitBytes 16777216;
pagespeed EnableFilters inline_google_font_css;

#######################################################
## 1.6.29.3 beta defaults
######################################
pagespeed AvoidRenamingIntrospectiveJavascript on;
pagespeed ImageInlineMaxBytes 3072;
pagespeed CssImageInlineMaxBytes 0;
#pagespeed MaxInlinedPreviewImagesIndex -1;
#pagespeed MinImageSizeLowResolutionBytes 3072;

#######################################################
## ngx_pagespeed filters settings below ##
######################################

  # show half the users an optimized site, half the regular site
  # change UA-XXXXXXXXXX-1 to your GA unique id
  # uncomment - remove hash # in front of below 5 lines to enable
#  pagespeed RunExperiment on;
#  pagespeed AnalyticsID UA-XXXXXXXXXX-1;
#  pagespeed ExperimentVariable 1;
#  pagespeed ExperimentSpec "id=1;percent=50;level=CoreFilters;enabled=collapse_whitespace,remove_comments;";
#  pagespeed ExperimentSpec "id=2;percent=50";

  # Filter settings
  # https://developers.google.com/speed/pagespeed/module/filter-attribute-elide
   pagespeed EnableFilters elide_attributes;

  # https://developers.google.com/speed/pagespeed/module/filter-dedup-inlined-images
   pagespeed EnableFilters dedup_inlined_images;

  # filters outlined at http://ngxpagespeed.com/ngx_pagespeed_example/
  pagespeed RewriteLevel CoreFilters;
  pagespeed EnableFilters collapse_whitespace,remove_comments;

  # make_google_analytics_async
  # https://developers.google.com/speed/docs/mod_pagespeed/filter-make-google-analytics-async
#  pagespeed EnableFilters make_google_analytics_async;

  # prioritize_critical_css
  # https://developers.google.com/speed/docs/mod_pagespeed/filter-prioritize-critical-css
   pagespeed EnableFilters prioritize_critical_css;

  # move_css_to_head
  # https://developers.google.com/speed/docs/mod_pagespeed/filter-css-to-head
  pagespeed EnableFilters move_css_to_head;

  # move_css_above_scripts
  # https://developers.google.com/speed/docs/mod_pagespeed/filter-css-above-scripts
  pagespeed EnableFilters move_css_above_scripts;

  # combine_css
  # https://developers.google.com/speed/docs/mod_pagespeed/filter-css-combine
  pagespeed EnableFilters combine_css;

   # Uncomment this if you want to prevent mod_pagespeed from combining files
   # (e.g. CSS files) across paths
   #
#  pagespeed CombineAcrossPaths off;

  # combine_javascript
  # https://developers.google.com/speed/docs/mod_pagespeed/filter-js-combine
  pagespeed EnableFilters combine_javascript;
  pagespeed MaxCombinedJsBytes 140000;
  pagespeed EnableFilters defer_javascript;

  # extend_cache
  # https://developers.google.com/speed/docs/mod_pagespeed/filter-cache-extend
#  pagespeed EnableFilters extend_cache;

  # rewrite_css
  # https://developers.google.com/speed/docs/mod_pagespeed/filter-css-rewrite
  pagespeed EnableFilters rewrite_css;

  # rewrite_javascript
  # https://developers.google.com/speed/docs/mod_pagespeed/filter-js-minify
  pagespeed EnableFilters rewrite_javascript;

  # inline_javascript
  # https://developers.google.com/speed/pagespeed/module/filter-js-inline
  pagespeed EnableFilters inline_javascript;

  # inline_preview_images
  # https://developers.google.com/speed/pagespeed/module/filter-inline-preview-images
  pagespeed EnableFilters inline_preview_images;

  # resize_mobile_images
  # https://developers.google.com/speed/pagespeed/module/filter-inline-preview-images#resize_mobile_images
  pagespeed EnableFilters resize_mobile_images;
  pagespeed MaxInlinedPreviewImagesIndex 6;
  pagespeed MinImageSizeLowResolutionBytes 3072;

  # lazyload_images
  # https://developers.google.com/speed/docs/mod_pagespeed/filter-lazyload-images
  pagespeed EnableFilters lazyload_images;
  pagespeed LazyloadImagesAfterOnload off;

  # rewrite_images
  # https://developers.google.com/speed/docs/mod_pagespeed/filter-image-optimize
   pagespeed EnableFilters rewrite_images;
  #pagespeed DisableFilters rewrite_images;
  #pagespeed DisableFilters recompress_images;
  #pagespeed DisableFilters convert_png_to_jpeg;
  #pagespeed DisableFilters extend_cache_images;
  pagespeed EnableFilters convert_png_to_jpeg;
  pagespeed EnableFilters convert_jpeg_to_webp;
  pagespeed EnableFilters convert_to_webp_lossless;

  # sprite_images
  # https://developers.google.com/speed/docs/mod_pagespeed/filter-image-sprite
pagespeed EnableFilters rewrite_css,sprite_images;

  # Bound the number of images that can be rewritten at any one time; this
  # avoids overloading the CPU.  Set this to 0 to remove the bound.
  #
#  pagespeed ImageMaxRewritesAtOnce 2;

  # insert_dns_prefetch
  # https://developers.google.com/speed/docs/mod_pagespeed/filter-insert-dns-prefetch
#  pagespeed EnableFilters insert_dns_prefetch;

  # InPlaceResourceOptimization
  # https://developers.google.com/speed/pagespeed/module/system#ipro
  # Enabled by default as of 1.9.32.1
  pagespeed InPlaceResourceOptimization off;
#######################################################