<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Gossamer Blog &#187; Optimizations</title>
	<atom:link href="http://www.gossamer-threads.com/blog/category/optimizations/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.gossamer-threads.com/blog</link>
	<description>Blog em if you got em!</description>
	<lastBuildDate>Thu, 08 Aug 2013 23:35:31 +0000</lastBuildDate>
	<language>en-US</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	
		<item>
		<title>Optimize Your Mobile Website With GTmetrix</title>
		<link>http://www.gossamer-threads.com/blog/optimize-your-mobile-website-with-gtmetrix/</link>
		<comments>http://www.gossamer-threads.com/blog/optimize-your-mobile-website-with-gtmetrix/#comments</comments>
		<pubDate>Wed, 01 May 2013 00:03:21 +0000</pubDate>
		<dc:creator>stella</dc:creator>
				<category><![CDATA[Optimizations]]></category>
		<category><![CDATA[Product Announcements]]></category>
		<category><![CDATA[GTmetrix]]></category>
		<category><![CDATA[Mobile]]></category>

		<guid isPermaLink="false">http://www.gossamer-threads.com/blog/?p=3916</guid>
		<description><![CDATA[GTmetrix is proud to announce mobile testing for your sites! See how your website performs on an actual mobile phone and optimize your user&#8217;s experience on a wide variety of mobile devices. Our mobile service is currently in beta, and so we are only offering mobile testing in our default Vancouver, BC. location and apologize [...]]]></description>
				<content:encoded><![CDATA[<p><a href="http://www.gossamer-threads.com/blog/optimize-your-mobile-website-with-gtmetrix/"><img class="alignnone size-full wp-image-4057" alt="Optimize Your Mobile Website With GTmetrix" src="http://www.gossamer-threads.com/blog/wp-content/uploads/2013/04/gtmetrix-mobile-title.jpg" width="550" height="160" /></a></p>
<p>GTmetrix is proud to announce <strong>mobile testing</strong> for your sites!</p>
<p>See how your website performs on an actual mobile phone and optimize your user&#8217;s experience on a wide variety of mobile devices.</p>
<p><span id="more-3916"></span></p>
<p><strong>Our mobile service is currently in beta</strong>, and so we are only offering mobile testing in our default Vancouver, BC. location and apologize in advance for any issues you might encounter.</p>
<h3>Our mobile testing suite</h3>
<p>We offer a few tools to help users optimize for mobile:</p>
<ul>
<li><strong>Page Analysis with Mobile Specific Rulesets</strong><br />
We use Google&#8217;s Page Speed ruleset with their <a href="https://developers.google.com/speed/docs/best-practices/mobile/" target="_blank">prioritization for mobile devices</a>.</li>
<li><strong>High Quality Video Capture</strong><br />
Get real-time playback of your page loading on a mobile device. We offer full, high-quality video capture without impacting the results of your test.</li>
<li><strong>More Detailed and Complete HAR Files</strong><br />
Our mobile HAR files include DNS lookup time, blocking time, window.onload time and DOM loaded time &#8211; more accurate than any other mobile HAR file out there. SSL traffic is also properly captured.</li>
</ul>
<p>Combined with our existing GTmetrix tools, developers can ensure that their site performs the best it can on mobile devices!</p>
<h3>How we did it</h3>
<p>After an intense period of research and development, we were able to interface GTmetrix with actual Android phones (Galaxy Nexuses).</p>
<p>Utilizing a combination of HDMI adaptors, video capture cards and WiFi configurations, a customized script connects to the Chrome browser application on the phones via WiFi and generates a report that focuses on a specific rule-set tailored for mobile phones (Page Speed Mobile).</p>
<p align="center"><img class="size-medium wp-image-3958 " title="Android phone" alt="android phone_blog" src="http://www.gossamer-threads.com/blog/wp-content/uploads/2013/04/android-phone_blog.jpg" width="510" height="380" /><br />
<span class="smaller">One of our Android phones in action</span></p>
<p>We&#8217;re not running simulated tests by restricting resolutions &#8211; <strong>we&#8217;re actually sending your URL to a real Android device</strong>!</p>
<p><a href="http://gtmetrix.com/changes.html#changes-mobile" target="_blank">Read more about our mobile features here »</a></p>
<h3>Get Started With GTmetrix Mobile Testing</h3>
<p>Since we&#8217;re still in Beta, we currently provide 2 devices for mobile analysis. <strong>You may experience a slight queue.</strong> PRO users however, will get higher priority for their mobile analyses.</p>
<p>As we mature the service, more devices for analysis as well as more device platforms (iPhones, other Android devices) are planned for the future as usage increases.</p>
<p>Best of all, <strong>it&#8217;s FREE</strong> for registered users! <a href="http://gtmetrix.com" target="_blank">Log in to your GTmetrix account</a> and give it a try. We&#8217;d love to hear your <a href="http://gtmetrix.com/contact.html" target="_blank">feedback</a>!</p>
]]></content:encoded>
			<wfw:commentRss>http://www.gossamer-threads.com/blog/optimize-your-mobile-website-with-gtmetrix/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
		<item>
		<title>Implementing E-Commerce: Moving AMT Forward</title>
		<link>http://www.gossamer-threads.com/blog/implementing-e-commerce-moving-amt-forward/</link>
		<comments>http://www.gossamer-threads.com/blog/implementing-e-commerce-moving-amt-forward/#comments</comments>
		<pubDate>Tue, 15 Jan 2013 23:47:36 +0000</pubDate>
		<dc:creator>Bruce</dc:creator>
				<category><![CDATA[Featured Clients]]></category>
		<category><![CDATA[Optimizations]]></category>
		<category><![CDATA[Product Related]]></category>
		<category><![CDATA[e-commerce]]></category>
		<category><![CDATA[Gossamer Links]]></category>

		<guid isPermaLink="false">http://www.gossamer-threads.com/blog/?p=3384</guid>
		<description><![CDATA[Adding a webshop to your site can be a headache, especially if you have a large sales catalog which has to be migrated online. You don&#8217;t want your existing site to experience any downtime, and you want customers to find shopping online with you easy and intuitive, while still providing them with the products and [...]]]></description>
				<content:encoded><![CDATA[<p align="center">
<a href="/blog/implementing-e-commerce-moving-amt-forward/"><img src="http://www.gossamer-threads.com/blog/wp-content/uploads/2013/01/title.jpg" alt="Implementing E-Commerce: Moving AMT Forward" title="Implementing E-Commerce: Moving AMT Forward" width="550" height="122" class="aligncenter size-full wp-image-2820" /></a>
</p>
<p>Adding a webshop to your site can be a headache, especially if you have a large sales catalog which has to be migrated online.  You don&#8217;t want your existing site to experience any downtime, and you want customers to find shopping online with you easy and intuitive, while still providing them with the products and information they expect.  When Advanced Marine Technologies wanted to consolidate their product catalogs and add a new online store, they came to Gossamer Threads to give them all the functionality they wanted without any hassle or unnecessary change to their workflow.  Here&#8217;s how we helped AMT make the move into e-commerce smoothly and securely, using Gossamer Links and a custom shopping cart, and implementing a careful and detailed import of AMT&#8217;s multiple product catalogs.</p>
<p><span id="more-3384"></span></p>
<h3>Building Webshops to Suit</h3>
<p>AMT has a unique history, in that it represents the amalgamation of three existing marine part manufacturers, representing the full price spectrum available to customers.  A key issue in building AMT&#8217;s webshop would be the creation of a new, consolidated product catalog, while maintaining the information contained in the legacy catalogs.  Maintaining these legacy catalogs was of critical importance, as AMT&#8217;s customers need to know which products are compatible with each other.</p>
<p>Building a webshop from scratch presents challenges, but also allowed for customization from the ground up, tailored to address AMT&#8217;s existing workflow and unique catalog situation.  Our Gossamer Links platform with a MySQL database offered the versatility this project needed, but would have to be augmented by a completely new shopping cart to accommodate the specificity of AMT&#8217;s data.</p>
<p align="center">
<a href="http://www.gossamer-threads.com/blog/wp-content/uploads/2013/01/amtstorefront.jpg"><img src="http://www.gossamer-threads.com/blog/wp-content/uploads/2013/01/amtstorefront.jpg" alt="AMT Storefront" title="AMT Storefront" width="500" height="398" class="aligncenter size-full wp-image-2820" /></a><br /><span class="smaller">The new AMT storefront page.</span>
</p>
<ul>
<li>The new site was custom-built for an established customer base accustomed to phone ordering, rather than online shopping.</li>
<li>We created accommodations for the rigorous detail of AMT&#8217;s boating parts catalog: weights, schematic files, and compatibility with other parts all had to be incorporated. While new product numbers were created, legacy product numbers were also maintained, ensuring that AMT&#8217;s customers had all of the compatibility information they needed to make informed purchases.</li>
<li>Printer-friendly versions of all product pages were also designed, giving prospective customers all of the information they need on a single sheet.</li>
<li>We used Paypal Pro for payment integration, giving customers the option to stay on AMT&#8217;s site while making payments, rather than being redirected to Paypal&#8217;s site.</li>
<li>Shipping prices are calculated in real-time: data is pulled from FedEx and Canada Post, giving customers a range of shipping options and prices as soon as they enter their address, all on the same page.</li>
<li>A custom back-end payment administration system was built for AMT&#8217;s staff, allowing them to view, search, and update customer orders instantly, informing customers of the progress of their orders and storing all sales records in an easily manageable format.</li>
<li>During the course of our development, AMT incorporated two more extant parts manufacturers into their umbrella company.  The new indexing system we created was able to integrate those manufacturer&#8217;s catalogs as well.  We gave AMT the infrastructure to expand their business in the future, and add more products to their webshop as the company grows.</li>
</ul>
<p align="center">
<a href="http://www.gossamer-threads.com/blog/wp-content/uploads/2013/01/amtorder.jpg"><img src="http://www.gossamer-threads.com/blog/wp-content/uploads/2013/01/amtorder.jpg" alt="AMT Order Management Panel" title="AMT Order Management Panel" width="500" height="367" class="aligncenter size-full wp-image-2820" /></a><br /><span class="smaller">An order as it appears in the AMT Order Management Panel. Note the options to update the order&#8217;s status and generate invoices.</span>
</p>
<h3>Importing Two Tables</h3>
<p>After analyzing AMT&#8217;s existing product database, we determined that storing data within two separate Gossamer Links tables (but one installation) would be the optimal route.  With many of AMT&#8217;s products being available in different sizes, materials, and colours, we realised that normalizing the data &#8211; ie, building one table with the core products, and another with the different variations of those products &#8211; would have multiple benefits.</p>
<ul>
<li>Shoppers can browse and purchase different styles or sizes of a product without having to view multiple product pages &#8211; ten of one product in red and half a dozen in blue can all be added to the cart from the same page.</li>
<li>Normalizing data makes for less maintenance: rather than having to update thirty different records when a core product description or price is changed (ie, one for each colour or size), modifying the core product&#8217;s record in the first table is all that is required.</li>
</ul>
<p align="center">
<img src="http://www.gossamer-threads.com/blog/wp-content/uploads/2013/01/amtitem.png" alt="AMT Item Listing" title="AMT Item Listing" width="411" height="622" class="aligncenter size-full wp-image-2820" /><br /><span class="smaller">A sample item on AMT&#8217;s webshop. Multiple styles and sizes can be ordered, and extra images and compatibility can be viewed.</span>
</p>
<p>Once an order is completed, two e-mails are sent: one to the customer with an auto-generated PDF containing the order number, and one to AMT&#8217;s staff containing another PDF.  After AMT ships the order, a third e-mail containing a tracking number is automatically sent to the customer.</p>
<p>Importing AMT&#8217;s existing product data into this new table structure was a challenge.  The product catalog was stored in a single Excel file which contained a wide range of data: this had to be organized into numerous categories and product types before the import could be performed.  Custom import code had to be written in order to preserve category and subcategory hierarchies in the new tables.  Given the large range of types of products and sub-types of products contained within the file, many table columns had to be accommodated in this code.</p>
<h3>Advancing E-Commerce</h3>
<p>Implementing an e-commerce platform can seem like an insurmountable task, but GT has the expertise to integrate sales into your website while maintaining your inventory&#8217;s diversity and appeal.  Interested in moving your business forward?  <a href="https://www.gossamer-threads.com/contact/">Let&#8217;s talk</a>.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.gossamer-threads.com/blog/implementing-e-commerce-moving-amt-forward/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Optimizing The Student Room</title>
		<link>http://www.gossamer-threads.com/blog/optimizing-the-student-room/</link>
		<comments>http://www.gossamer-threads.com/blog/optimizing-the-student-room/#comments</comments>
		<pubDate>Wed, 15 Aug 2012 23:18:04 +0000</pubDate>
		<dc:creator>Bruce</dc:creator>
				<category><![CDATA[Featured Clients]]></category>
		<category><![CDATA[Optimizations]]></category>
		<category><![CDATA[Gossamer Host]]></category>
		<category><![CDATA[hosting]]></category>
		<category><![CDATA[servers]]></category>

		<guid isPermaLink="false">http://www.gossamer-threads.com/blog/?p=3518</guid>
		<description><![CDATA[Site performance can be a complex issue, with all manner of interdependent factors conflicting and cascading in unexpected ways. When one of our clients&#8217; sites starts experiencing problems which can quickly take a toll on their business, we take a methodical approach, examining all of the components that go into a website&#8217;s performance, and enacting [...]]]></description>
				<content:encoded><![CDATA[<p align="center">
<a href="http://www.gossamer-threads.com/blog/optimizing-the-student-room/"><img src="http://www.gossamer-threads.com/blog/wp-content/uploads/2012/08/TSR.jpg" alt="The Student Room" title="The Student Room" width="550" height="121" class="aligncenter size-full wp-image-2820" /></a>
</p>
<p>Site performance can be a complex issue, with all manner of interdependent factors conflicting and cascading in unexpected ways.  When one of our clients&#8217; sites starts experiencing problems which can quickly take a toll on their business, we take a methodical approach, examining all of the components that go into a website&#8217;s performance, and enacting a point-by-point plan which addresses front and back end issues.  Here&#8217;s how we developed a solution for The Student Room, a high-traffic forum which ran into trouble after a routine software upgrade.</p>
<p><span id="more-3518"></span></p>
<h2>An Unexpected Problem</h2>
<p><a href="http://www.thestudentroom.co.uk/">The Student Room</a> is the UK&#8217;s largest online student community, and is home to over one million users.  With over 38 million posts and an average of a million page views per day, TSR&#8217;s forums (powered by a highly customized vBulletin installation) need to be as efficient and user-friendly as possible.  </p>
<p align="center">
<img src="http://www.gossamer-threads.com/blog/wp-content/uploads/2012/08/tsr.png" alt="The Student Room" title="The Student Room" width="550" height="173" class="aligncenter size-full wp-image-2820" /><br /><span class="smaller">The Student Room Forums. Note the fast posting rate and incredibly high numbers of posts.</span>
</p>
<p>A problem arose when TSR updated to a new version of vBulletin, however: users&#8217; posting rates took a dramatic 30% drop, even though traffic was increasing.  Monitoring revealed that page load times (especially on thread view pages) had increased by roughly 500 milliseconds.  While that may not sound like a significant increase, it was enough to radically affect activity on the TSR forums; while the site&#8217;s established user base was still visiting, they weren&#8217;t interacting with and posting on the site nearly as much.</p>
<p>Most web optimizations involve rectifying obvious, drastic inefficiencies in software, but the problem presented in TSR&#8217;s case was a more subtle one: counteracting the effects of a minor and irreversible script update.  In response, we fine-tuned the site at two levels: back-end database and server issues, and front-end script and HTML management. </p>
<h2>Back-End: Rebuilding Server Architecture</h2>
<p>The overarching goal of our back-end optimizations was to to reduce the load time of The Student Room&#8217;s main pages to less than 500ms, faster than they&#8217;d been even before the slow-down caused by the vBulletin upgrade.  Here&#8217;s a breakdown of how we went about achieving that.</p>
<p align="center">
<img src="http://www.gossamer-threads.com/blog/wp-content/uploads/2012/08/servers.jpg" alt="The Student Room" title="The Student Room" width="550" height="200" class="aligncenter size-full wp-image-2820" /><br /><span class="smaller">Server optimization is crucial to any plans for decreasing load times.</span>
</p>
<h3>Server Infrastructure</h3>
<ul>
<li>We investigated TSR&#8217;s existing cluster setup and checked for bottlenecks using metrics like hard drive and memory utilization, processing power and bandwidth.</li>
</ul>
<h3>Code Profiling</h3>
<ul>
<li>We profiled PHP code using programs like <a href="http://xdebug.org/">XDebug</a> and <a href="http://kcachegrind.sourceforge.net">Cachegrind</a>, <a href="http://newrelic.com/">New Relic</a>&#8216;s monitoring suite, and custom written profiling scripts to find bottlenecks and inefficient code.</li>
<li>We checked for and rewrote inefficient code.</li>
</ul>
<h3>MySQL Query Optimization</h3>
<ul>
<li>We investigatied the frequency and distribution of SQL queries, and optimized slow queries.</li>
<li>We reviewed and optimized query caching.</li>
<li>We optimized column indexing.</li>
<li>We reviewed and optimized the cluster&#8217;s MySQL server configuration to suit this specific use case.</li>
</ul>
<h3>Memcached</h3>
<p>We cached heavy SQL queries and expensive functionality on a dedicated <a href="http://memcached.org/">Memcached</a> server within the cluster to reduce load on other back-end servers.  After this, we reviewed and tested various setups to optimize this server.  This process in particular yielded the most significant performance impact.</p>
<ul>
<li>We studied and tested multiple Memcached PHP client libraries and decided to switch to the faster <a href="http://code.google.com/p/memcached/wiki/PHPClientComparison">Memcached library</a>.</li>
<li>We implemented support for the Memcached PHP client library in vBulletin.</li>
<li>We consolidated cached objects to reduce overhead.</li>
</ul>
<h3>Varnish</h3>
<p><a href="https://www.varnish-cache.org/">Varnish</a> is a web application accelerator which caches rendered HTML pages and static content to speed up delivery and reduce server load by caching frequently accessed content, which we also integrated into TSR&#8217;s cluster.</p>
<ul>
<li>We implemented Varnish caching of rendered forum pages for guest users, drastically lowering load times.</li>
<li>We also tweaked server settings in order to maximise Varnish&#8217;s impact.</li>
</ul>
<p align="center">
<img src="http://www.gossamer-threads.com/blog/wp-content/uploads/2012/08/servers2.jpg" alt="The Student Room" title="The Student Room" width="396" height="362" class="aligncenter size-full wp-image-2820" /><br /><span class="smaller">Having a technical partner who can get the most out of your site&#8217;s servers can open new doors for your web performance.</span>
</p>
<h2>Front-End: Designing a Smoother User Experience</h2>
<p>We weren&#8217;t satisfied with simply retooling The Student Room&#8217;s server architecture.  We set a goal of displaying the content of the first post in a thread in 2.5 seconds for a uncached page on a user&#8217;s browser, and took the following steps to make that happen.</p>
<ul>
<li>First, we profiled the site&#8217;s existing front-end performance using <a href="http://gtmetrix.com/">GTMetrix</a>, <a href="http://newrelic.com/">New Relic</a> and <a href="http://oss.oetiker.ch/smokeping/">SmokePing</a>.</li>
<li>We reordered JavaScript and CSS to optimize the simultaneous downloading and processing of scripts and style sheets.</li>
<li>We performed JavaScript and CSS minification, removing superfluous data like whitespace and comments.</li>
<li>We optimized the distribution of static content between static servers to allow browsers to download more resources in parallel.</li>
<li>We consolidated images in <a href="http://www.w3schools.com/css/css_image_sprites.asp">sprites</a></li>
<p>.</p>
<li>3rd party scripts (such as tracking code and social media buttons) are now loaded separately from and simultaneous to core pages, and are loaded in asynchronous order to prevent pauses in rendering of the core page.</li>
</ul>
<h2>The Results: Faster Loading, Less Server Costs</h2>
<p>These measures prompted immediate and dramatic results.  Main pages load times were reduced to 500 milliseconds; an over 100% speed increase for some pages.</p>
<p align="center">
<img src="http://www.gossamer-threads.com/blog/wp-content/uploads/2012/08/loadtime-before-after.png" alt="The Student Room - Load Time" title="The Student Room - Load Time" width="550" height="608" class="aligncenter size-full wp-image-2820" />
</p>
<p>Perhaps most importantly, all of these changes had a marked effect on the original issue at stake: user participation on The Student Room.  Posting rates returned to and exceeded pre-upgrade levels.</p>
<p>In addition to making their userbase happy, our optimization gave the people working at The Student Room plenty to smile about.  Our back-end work decreased <a href="http://en.wikipedia.org/wiki/Load_%28computing%29">server load</a> which allows for more traffic on the same hardware.  The bottom line?  A sleeker, faster site which costs substantially less to maintain.</p>
<p align="center">
<img src="http://www.gossamer-threads.com/blog/wp-content/uploads/2012/08/loadtime-before-after1.png" alt="The Student Room - Server Load" title="The Student Room - Server Load" width="550" height="526" class="aligncenter size-full wp-image-2820" /><br /><span class="smaller">Charting load times.</span>
</p>
<p>Here&#8217;s what the team at The Student Room had to say about the optimization:</p>
<blockquote><p>&#8220;The Student Room Group and Gossamer Threads have been working together for many years, overcoming countless technical challenges as the popularity and scale of <A href="http://www.thestudentroom.co.uk">www.thestudentroom.co.uk</a> has grown. Websites need to be as responsive as possible and today&#8217;s sophisticated users demand speed. The upgrade caused a significant slowdown and our members reacted accordingly. We needed to act quickly and, with a multi-disciplined team implementing cutting edge optimization strategies, together with some state of the art hardware, GT greatly improved our response times, and variance was pretty much removed entirely.&#8221;</p></blockquote>
<h2>Get More From Your Site</h2>
<p>As we&#8217;ve seen, <a href="http://www.gossamer-threads.com/consulting/optimization.html">website optimization</a> can be a win-win scenario for both you and your users.  Interested in finding out what a tune-up could do for your site?  <a href="https://www.gossamer-threads.com/contact/">Let&#8217;s talk</a>.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.gossamer-threads.com/blog/optimizing-the-student-room/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>