Web Monitoring Services

Introduction to Web Performance Optimization

What is Web Performance Optimization (WPO)?

Websites in every domain – ecommerce, enterprise, social networking, entertainment, publishing, healthcare, retail are becoming increasingly complex these days. Users manage, upload and maintain tera bytes (huge amounts) of data online. They expect real-time updates and information exchange at the speed of an eye-blink. We want news, notifications, newsfeed as it happens; when it happens. We expect web systems to process, analyze and do data analytics quickly so we may visualize and track the efficiency of our product/s.

Web Performance Optimization (WPO) is the science behind giving users that seamless experience on the browser where they get all information they need in lightning speed without having to wait for the data to load on the page.

Why to optimize for website performance?

As per a survey from strange loop networks, a ONE-SECOND delay in page load time leads to 7% loss in conversions, which leads to 11% fewer page views, which in turn leads to 16% decrease in customer satisfaction. In dollar terms this means that if your site earns $100,000 a day, then you could lose 2.5Million $ in sales in a year due to a slow website.

Popular metrics and research also show that 57% of online customers will abandon a slow page after 30 seconds.

Impact of Website Performance Optimization

1. Slow web platforms affect overall user happiness and satisfaction levels.

   You may make a kick-ass site which has great features, has an aesthetically amazing UX and web design, and uses the latest technology frameworks and tools. You spend enough on marketing to send reasonable traffic to your site. However, you notice that there is NO sustained traffic or revenue. There are no repeat visits or traffic growth So What could be the reason??

   Ans. Your site is slow, it takes time to load and see information. This irritates the users and they don’t wish to come back!

2. People have limited time and are extremely busy. They want to find the right information in the least time possible. A slow loading site where the users must wait for page to load, or for information to update, will Force them to Google for faster competitor alternatives to your site.
3. Many users suffer from slow internet connections. A slow site on top of this makes their whole experience completely unbearable thereby affecting overall site revenue and traffic in the long run.

Advantages of Website Performance Optimization

1. Website performance optimization drives leads and increases conversions. It increases visitor loyalty and retention. Your site will get more traffic and make more revenue.
2. Web applications which are optimized for performance have lower and reduced bounce rates.
3. Google blogged that Faster sites will rank higher in their search results. This means that your site will be listed above and before that of your competitor on the google search results page if it is optimized for performance.
4. It costs less to run fast sites – fast sites need less compute cycles, store and send less data and use optimized technology for information retrieval and display. Hence the costs of internet bandwidth, storage and machines to host such platforms are less.
5. Green – Web performance reduces power consumption and ultimately shrinks the Web’s carbon footprint.
6. It gives Virality and Its Cool – Users Love to talk about *fast* sites. You will get differentiated and stand out. Your site will gain from word-of- mouth publicity thereby saving on marketing budgets.

Best Practices for optimizing a website Performance?

A website or web platform essentially consists of two major components.

1. BACKEND – The backend which is the database and business logic centered on I/O, file reads, lookups, information storage/Update, analytics, processing, web service calls and stitching together of the HTML to send to the frontend.
2. FRONTEND – The frontend which is the display technology around rendering of the page including network time for downloading all resources referenced in the page like JavaScript, images, CSS.

According to Mr. Steve Sounders (Pioneers of WPO), 80% of the time it takes to load a web page is controlled by the frontend structure.

So the best practices for webmasters or website administrators for doing web performance optimization are:

Focus more on the frontend website optimization tips like:

• Minimize the number of round trips from the web browser to your server
• Reduce the # of resources to be fetched and downloaded to render the page
• Reduce the payload size
• Optimize the site layout and navigation for performance
• Use efficient caching techniques and proxies using latest html5 cache
• Use latest technologies in css3 to replace JS (JavaScript) processing wherever applicable
• Optimize images

The practical ways of doing these optimizations are discussed below in the ‘What we do’ section of this web page.

Optimize the backend code by getting a good DBA –

Even though the backend accounts for 20% improvement in site speed, it still pays a pivotal role in overall user experience. If the backend is not performance optimized, then eventually a time will come when your site’s response times starts increasing exponentially after a certain threshold user load or traffic is reached.

• Get a good DBA to study your MySQL setup, configuration
• Observe number of joins and reduce the same via de-normalization
• Use NoSQL databases wherever needed
• Use Heap and stack memory efficiently
• Optimize in memory processing by using better data structures
• Optimize for file I/O by using latest technologies like nods.js etc.
• Optimize for the Mobile

The mobile phone has limited CPU and batter resources, it has less space and uses a lite database. It also has limited screen size and real estate. Due to intermittent connectivity, the data to be sent and processed on the mobile device must be very less and optimized.

The speed must be much faster of your site on the mobile. Appropriate mobile application architecture and mobile application development paradigms must be used to monitor and design the same.

See our whitepaper on Mobile Optimized design available at: ATLOGYS ACADEMY – MOBILE APPLICATION ARCHITECTURE

Have a performance optimized cloud deployment infrastructure

Once your site’s frontend and backend code are optimized, it is deployed on a hardware machine which acts as the server to handle the requests and provide the responses. Every machine has finite CPU, finite memory and finite capacity. Hence, you must know the max and min threshold number of requests your deployment machines can handle. As and when your traffic load increases beyond that threshold, you must set auto scaling and use cloud deployment techniques like elastic load balancing etc. to maintain site’s performance.

Sending more traffic to a machine above and beyond what it can handle will cause it to slow down the response of every request thereby affecting experience of all users.

Testing Web Performance

There are many tools available for testing web performance and getting some initial benchmark numbers. The three most common tools that you can self-deploy are:

1. Pingdom site speed test – http://tools.pingdom.com/fpt/ – Enter the website home page and get instant results on performance including load time, avg. comparison with other sites, page size etc.
2. Yslow – available in both Firefox and chrome as a browser extension, this tool will analyze your site’s performance and suggest improvement techniques on basis of some web speed rules.
3. Google’s page speed – https://developers.google.com/speed/pagespeed/ – Helps implement web performance best practices.

For complicated web platforms, it is recommended to use open source tools which must be configured, customized and setup for that site. These can be used to do load testing, stress testing and extensive latency testing on the site.

Such tools allow us to simulate user traffic prior to launching the site in the real world. They can also be used to test performance f web services API calls in a simulated integrated environment

How will Atlogys Consultants help to Optimize Web Performance?

What we do to Optimize Web Performance?

Optimize your site for performance – We advocate and following website optimization tips: (the best practices mentioned above) –

Frontend web performance optimizations

• Image compression – CSS sprites, Image maps, smushIT, webP, avoid scaling
• Minify JavaScript and CSS, combine files and consolidate, only load whatever is needed per page, defer loading of JS till the end
• Use expiry headers, reduce cookie size, use eTag’s optimally
• Reduce DNS lookups, use CDN networks
• Intelligent DOM manipulation with html5 frameworks like kendoUI, angular JS
• Provide animations and transitions and UX effects with css3 and NOT JavaScript
• Use Ajax and cache the same
• Optimize server configurations – Compress files – gzip, Max connections optimization for apache
• + Lots more …

Backend web Performance optimization

• Analyze and study MySQL Database schema – reduce joins, de-couple data
• Add missing indexes if any
• Configure MySQL tables and data types
• Study RAM and HEAP utilization
• Do CPU and memory profiling
• Advocate usage of memcached, REDIS etc. data stores for application level performance management if found appropriate

Create an optimized cloud deployment infrastructure for site launch

• Setup Auto Scaling and Elastic Load Balancing
• Enable Elastic Cache
• Use S3 and split serving of static vs. dynamic data

Perform website performance Monitoring on a continuous basis

• Measure navigation timing, user network timing, server timing and database timing and set min vs. max values for each
• Setup alerts to trigger emails if site’s performance drops below X seconds per page
• Perform load tests and stress testing

Read our whitepaper on HOW TO RENDER LIGHTEING FAST WEB PAGES AT

Testing for hidden issues?

CPU profiling is a great way for testing hidden issues in code which are deep rooted and which affect site’s performance. These are difficult to dissect and fix. But profiling for memory and CPU is a great tool to identify and fix such hidden issues in performance.

Thread contention and improper locking – Often a backend code and core architecture problem, we can study the site’s code and reverse engineer on the design and architecture to find out such problems.

How we Optimize Web Performance?

Atlogys has a team of cloud computing consultants and web 2.0 administrators who are super finicky about performance. We have compiled our own battery of tests from various protocols and standards.

1. We can audit and assess your existing setups – We can do website performance testing and benchmarking using various monitoring tools.
2. We can identify frontend, backend and hidden issues affecting your website performance.
3. We take ownership of your cloud deployment and login ourselves to fix the bottlenecks and server configuration problems.
4. Our senior tech leads reverse engineer your architecture and code to identify core architecture bottlenecks that may be slowing down your site.
5. Our webmasters work with you team to fix all issues in code and deploy back on your version control.
6. We do a round of testing before and after our engagement to show you the speed improvements.

What technology do we use?

We use a mix of technology for web performance optimization. This includes the following:

• Open source technology to measure, monitor and fix web performance – like apache bench, pylot, Ngnix reverse proxy, loadimpact etc.
• Core system level calls like ping, netstat, httpperf, top, pmap, vmstat etc. form the basic starting points for analyzing performance
• Browser extensions available in Firefox and Chrome like Live HTTP headers, fasterfox, firebug, yslow
• Online tools like gtmetrix, pingdom, pagespeed etc.
• Browser level optimizations via HTML5 and Css3 attributes and commends
• Amazon EC2 and AWS services like CloudFront for CDN
• Monitoring tools like nagiOS, Amazon CloudWatch etc.

What Standards do we follow?

• We use www.webplatform.org standards convened by W3C and mediated by stewards of web – Google, adobe, Yahoo, Microsoft, Mozilla, Facebook and W3C.
• Atlogys web evangelists stay up to date and in sync with latest guidelines and best practices in field of web performance optimization – Articles about WPO And web performance standards
• For measuring performance, benchmark and testing – Web Timing Spec

Continuous Monitoring

Websites and web platforms are dynamic in nature. New pages are added and new feature releases are made on a continuous basis. It is important to keep monitoring performance on a continuous basis to catch and identify code changes that may lead to sudden increases in page load time or response time.

Website Performance monitoring is the process of scripting and running tests on a regular basis  to maintain the site’s performance whilst new rollouts keep launching.

Continuous Integration servers like Hudson/Jenkins can be used to create performance analysis dashboards which may turn RED when the page load time of any page goes beyond an acceptable threshold

Google Analytics can also monitor page performance and help catch such errors

Amazon monitoring tools like CloudWatch can be deployed to trigger email alerts to webmasters when their response time goes up – this helps in catching increases in things like database read time, database write time, CPU time, file I/O time.

The user network time and rendering time can be simulated with firebug to trigger alerts for the same. You can simulate various internet speeds and various locales to get the right numbers for the seconds it takes for end users to see the website.