Combination View Flat View Tree View
Threads [ Previous | Next ]
toggle
Luis Mas
Implementing RESS (Responsive Design With Server Components) in Liferay
October 24, 2013 9:06 AM
Answer

Luis Mas

Rank: Regular Member

Posts: 145

Join Date: May 18, 2009

Recent Posts

Hi all,

Recently I've read this article Lightening Your Responsive Website Design With RESS http://mobile.smashingmagazine.com/2013/10/08/responsive-website-design-with-ress/, It's a very interesting article on how to go further in improving Users Experience.

I think most of the things can be done with Liferay 6.2 (next version coming) using Resposive Web Design in conjunction with the WURLF Utilities provided, but one of the things I think it's not possible in an easy way to implement with Liferay is "Connectivity Detection" and depending on the bandwidth of the connection or the kind of connection of the device that requested a page in Liferay (Edge, GPRS, Wi-fi, ...) serve a content or other content.

You can imagine an User that is accesing from a SmartPhone, its network connection is very important when he/she is requesting a page, and maybe the response should be different if the User is accessing from a Wi-Fi connection or from a GPRS/Edge connection.

Do you think it would be an useful improvement to Liferay? I'm thinking on adding an improvement request.

Thanks for your opinion!!!
Juan Fernández
RE: Implementing RESS (Responsive Design With Server Components) in Liferay
October 28, 2013 3:12 AM
Answer

Juan Fernández

LIFERAY STAFF

Rank: Liferay Legend

Posts: 1227

Join Date: October 2, 2008

Recent Posts

Hola Luis:
I think that adding more control to device detection (for example adding a rule that makes decissions based on available bandwith) is a great idea. I'm not sure if WURLF can support this, but I agree it is worth analyzing.
I'll ping our WURLF expert (Milen) to see how hard it would be to implement it. Anyways, go ahead and open the feature request... and convince the community this is a good idea! emoticon
Thanks for your valuable feedback,
Juan
Jorge Ferrer
RE: Implementing RESS (Responsive Design With Server Components) in Liferay
October 28, 2013 3:37 AM
Answer

Jorge Ferrer

LIFERAY STAFF

Rank: Liferay Legend

Posts: 2756

Join Date: August 31, 2006

Recent Posts

Thanks Luis, we've been discussing for a while about this concept without knowing it had a name emoticon
Milen Dyankov
RE: Implementing RESS (Responsive Design With Server Components) in Liferay
October 28, 2013 5:54 AM
Answer

Milen Dyankov

LIFERAY STAFF

Rank: Regular Member

Posts: 219

Join Date: October 30, 2012

Recent Posts

While this is a very nice to have feature I'm afraid it's outside of the scope of WURFL. The information about the connection type/speed is not something that you can store in a database as it is not tided to the device and may change at any time without notice. WURFL on the other hand is simply a database and API containing stale device specific information. The same problem is with resolution - WURFL will tell you that the device resolution is 800x600 and it will tell you that it supports dual orientation but will NOT tell you whether the user is currently holding the device horizontally or vertically (which means the resolution can in fact be 600x800). Likewise WURFL can tell you weather the device supports WiFi, 3G, .... but it will NOT tell you what the current connection is.

One easy way to detect the connection speed (not exact but in terms of slow/fast) is to use Javascript timer in HEAD like this:
 1<script type="text/javascript">
 2    var slowLoad = window.setTimeout( function() {
 3        // redirect to page/site dedicated to low bandwidth connection
 4    }, 10 );
 5
 6    document.addEventListener( 'load', function() {
 7        window.clearTimeout( slowLoad );
 8    }, false );
 9</script>


This basically adds a timer as soon as the page starts loading and then removes it when "load" event occurs. If the remove does not happen is specified time then the connection is "slow", the code in the timer is executed and we can take some action (for example redirect to lightweight version of the site). To add this to every page you can check Samuel Kong's excellent post http://www.liferay.com/web/samuel.kong/blog/-/blogs/adding-a-javascript-to-every-page or you can try CustomGlobalMarkup plugin I wrote sometime ago (unfortunately not yet updated to 6.2)