vb.org Archive

vb.org Archive (https://vborg.vbsupport.ru/index.php)
-   Modification Requests/Questions (Unpaid) (https://vborg.vbsupport.ru/forumdisplay.php?f=112)
-   -   Tutorial/Article on Responsive Mobile Design (https://vborg.vbsupport.ru/showthread.php?t=320414)

final kaoss 10-05-2015 01:10 PM

I am aware that there are bootstrap tutorials out there. However, vbulletin's coding & multiple templates in a skin/style complicate things even more for someone like me.

In otherwords they have tutorials yes but none that are geared for vbulletin forums from what I've seen so far.

Max Taxable 10-05-2015 02:17 PM

Quote:

Originally Posted by webmastersun (Post 2556282)
What is the GLUT...

GLUT is loading the equivalent of a two minute music mp3 file on mobile browsers every pageload. That's the 1.8 MEGABYTE page load you have. And most of it is all the images, glitz, custom font files and massive scripts contained in your pageload, which I linked a detailed analysis of, earlier. It is 203 requests, 1.857 megabytes. On one of your smallest pages.

You are loading huge amounts of bytes with every pageload, on mobile browsers. It's slow on a PC with a fast cable connection, imagine how slow it is on a i-phone in 4G.

It is slow, it's not a opinion. It is a fact. And it's slow mainly because of the glut.
Quote:

Originally Posted by webmastersun (Post 2556282)
Oh I removed the link on my post if you think it's for promoting, for me I think it's an example for the OP...that's all.

I don't care what links you post. I am not a moderator or a admin here. I am pointing out your site is NOT a good example of mobile friendliness, and has NOTHING at all to do with bootstrap since is uses NO bootstrap at all.

Replicant 10-05-2015 02:57 PM

Quote:

Originally Posted by final kaoss (Post 2556322)
I am aware that there are bootstrap tutorials out there. However, vbulletin's coding & multiple templates in a skin/style complicate things even more for someone like me.

In otherwords they have tutorials yes but none that are geared for vbulletin forums from what I've seen so far.

I don't know how else to put it. You basically have to modify or rewrite the html in the templates and add the bootstrap classes where necessary to get the desired effect. Vbulletin's coding has nothing to do with it. You're not changing the information, you're changing the way it is presented using a CSS library.

TheLastSuperman 10-05-2015 06:07 PM

Quote:

Originally Posted by Max Taxable (Post 2556280)
Nonsense. It is slow because of the GLUT. No other reason. You have sacrificed performance, for appearance. It only satisfies your own ego, and does a horrible disservice to anyone trying to browse that pile of crap using mobile.

Stop, insulting our intelligence by constantly posting your link as a example of mobile friendliness, because it is way, way far from it. It's become just basically, spam in just about every thread about mobile, and it is the worst possible example to post. In fact it is a example of what NOT to be doing.


Go back to bed Max, you woke up on the wrongggggggg side this morning :p.

Roughly 9,856,243 ways to word it nicely but you simply went for the throat caveman/sabretooth tiger style and that is all.. I have nothing else my humor's ran dry lol!

Also just a side note that webmastersun is not a full-time devloper or anything of that nature so when people TRY and the end result looks good (appearance vs speed currently but can be worked on respectfully) despite his "ego" I'd say good job but there's room for improvement, just don't put them down then stomp them while they're down, geesh :p. Sorry my grandmother raised me w/ 1950-60's values so to me its just shocking how some act despite my often viewed as Carlos Mencia style humor, I'm full of shiskey too ya'know we just differ ;).

**If you have the default mobile style installed on vBulletin 4 then in your options make sure to set your desktop style as the primary, then allow members to change styles and also set the default mobile browser for older and new devices to the mobile style - this will make your site mobile friendly for Google.

Max Taxable 12-01-2015 01:02 AM

Quote:

Originally Posted by final kaoss (Post 2556188)
A quick write up on what to do to make vb4 styles mobile friendly would come in handy.

It should cover most of the recommendations from this test tool.

I finally accomplished this mission - getting a v4 style that is responsive, mobile-friendly, browser agnostic and is full featured not stripped down like the native v4 mobile style is.

It loads 264kb very greasy-fast, and has all the vB features and is even compatible with many add-ons and products. It's also pretty nice looking for desktop users.

Performance Test - straight As and Bs baby.

Sample it by clicking here.

Screenshot using Chrome in 400px width, to simulate a mobile device:

https://vborg.vbsupport.ru/external/2015/11/1.jpg

final kaoss 12-03-2015 02:28 PM

That skin looks awfully familiar... like the debutant one at themecrate.

btw thanks for that post Max, got me looking into this again. So far so good with under 300 KB of load on my side. I'm going to look into making some tables (<divs>) responsive & see if they help.

Showthread:

HTML Code:

<div id="header" class="floatcontainer doc_header">
<ul id="navtabs" class="navtabs floatcontainer">
#vbulletin_html
body > div.body_wrapper
#footer_copyright
#footer_morecopyright


Max Taxable 12-03-2015 05:08 PM

Quote:

Originally Posted by final kaoss (Post 2559654)
That skin looks awfully familiar... like the debutant one at themecrate.

That's exactly what it is, after some major adjustments.
Quote:

So far so good with under 300 KB of load on my side.
That's not a accurate, real world test. This is.

final kaoss 12-03-2015 10:06 PM

I use gtmetrix more than webpagetest for a few reasons.

I can better see what's going on with the more detailed yslow & pagespeed reports.
I can filter external resources with the adblock filter supplied so that I only see "local" resources.
Also, the history tracking comes in pretty handy.

Max Taxable 12-03-2015 10:24 PM

Was only pointing out, that test was inaccurate. Both in total requests and also in KB delivered.

I prefer to see the real picture.

final kaoss 12-03-2015 10:31 PM

Actually the results aren't that different for me.

507 kb & 64 requests on gtmetrix (with adblock off), you'll have to do a new test with it off
580 kb & 64 requests on webpage test

The difference being slightly different due to different adsense ads.


All times are GMT. The time now is 12:57 PM.

Powered by vBulletin® Version 3.8.12 by vBS
Copyright ©2000 - 2025, vBulletin Solutions Inc.

X vBulletin 3.8.12 by vBS Debug Information
  • Page Generation 0.01130 seconds
  • Memory Usage 1,752KB
  • Queries Executed 10 (?)
More Information
Template Usage:
  • (1)ad_footer_end
  • (1)ad_footer_start
  • (1)ad_header_end
  • (1)ad_header_logo
  • (1)ad_navbar_below
  • (1)bbcode_html_printable
  • (7)bbcode_quote_printable
  • (1)footer
  • (1)gobutton
  • (1)header
  • (1)headinclude
  • (6)option
  • (1)pagenav
  • (1)pagenav_curpage
  • (3)pagenav_pagelink
  • (1)post_thanks_navbar_search
  • (1)printthread
  • (10)printthreadbit
  • (1)spacer_close
  • (1)spacer_open 

Phrase Groups Available:
  • global
  • postbit
  • showthread
Included Files:
  • ./printthread.php
  • ./global.php
  • ./includes/init.php
  • ./includes/class_core.php
  • ./includes/config.php
  • ./includes/functions.php
  • ./includes/class_hook.php
  • ./includes/modsystem_functions.php
  • ./includes/class_bbcode_alt.php
  • ./includes/class_bbcode.php
  • ./includes/functions_bigthree.php 

Hooks Called:
  • init_startup
  • init_startup_session_setup_start
  • init_startup_session_setup_complete
  • cache_permissions
  • fetch_threadinfo_query
  • fetch_threadinfo
  • fetch_foruminfo
  • style_fetch
  • cache_templates
  • global_start
  • parse_templates
  • global_setup_complete
  • printthread_start
  • pagenav_page
  • pagenav_complete
  • bbcode_fetch_tags
  • bbcode_create
  • bbcode_parse_start
  • bbcode_parse_complete_precache
  • bbcode_parse_complete
  • printthread_post
  • printthread_complete