Web Performance Optimization A Practical Approach (Sufyan Bin Uzayr) (Z-Library)

📄 File Format: PDF

💾 File Size: 7.1 MB

📖 Read Online ⬇️ Download

Registered users can read the full content for free

Register as a Gaohf Library member to read the complete e-book online for free and enjoy a better reading experience.

📄 Page 1

(This page has no text content)

📄 Page 2

Web Performance Optimization

📄 Page 3

(This page has no text content)

📄 Page 4

Web Performance Optimization A Practical Approach Sufyan bin Uzayr

📄 Page 5

First edition published 2022 by CRC Press 6000 Broken Sound Parkway NW, Suite 300, Boca Raton, FL 33487-2742 and by CRC Press 2 Park Square, Milton Park, Abingdon, Oxon, OX14 4RN CRC Press is an imprint of Taylor & Francis Group, LLC © 2022 Sufyan bin Uzayr Reasonable efforts have been made to publish reliable data and information, but the author and publisher cannot assume responsibility for the validity of all materials or the consequences of their use. The authors and publishers have attempted to trace the copyright holders of all material reproduced in this publication and apologize to copyright holders if permission to publish in this form has not been obtained. If any copyright material has not been acknowledged please write and let us know so we may rectify in any future reprint. Except as permitted under U.S. Copyright Law, no part of this book may be reprinted, reproduced, transmitted, or utilized in any form by any electronic, mechanical, or other means, now known or hereafter invented, including photocopying, microfilming, and recording, or in any information storage or retrieval system, without written permission from the publishers. For permission to photocopy or use material electronically from this work, access www.copyright.com or contact the Copyright Clearance Center, Inc. (CCC), 222 Rosewood Drive, Danvers, MA 01923, 978-750-8400. For works that are not available on CCC please contact mpkbookspermissions@tandf. co.uk Trademark notice: Product or corporate names may be trademarks or registered trademarks and are used only for identification and explanation without intent to infringe. ISBN: 9781032067605 (hbk) ISBN: 9781032067599 (pbk) ISBN: 9781003203735 (ebk) DOI: 10.1201/9781003203735 Typeset in Minion Pro by KnowledgeWorks Global Ltd.

📄 Page 6

v Contents Acknowledgments, xiii About the Author, xv Chapter 1 ◾ What Web Performance Is and Why It Matters 1 WEBSITE PERFORMANCE IS KEY TO CUSTOMER RETENTION AND ACQUISITION 2 WEBSITE PERFORMANCE IS THE OBJECTIVE 3 WEB PERFORMANCE IS USER EXPERIENCE 3 Reducing Website Load Time 4 Making the Site User-Friendly 5 Measuring Website Performance 7 WHY WEB DEVELOPMENT MATTERS? 7 Better Website Performance Improves Brand Awareness 8 Better Website Performance Leads to Higher Conversion Rates 9 Web Performance Affects User Experience 11 Poor Website Performance Destroys Brands 12 Better Performing Websites Gain a Competitive Edge 13 Website Monitoring Is Essential 16 Mobile-First Design 21 CONCLUSION 23

📄 Page 7

vi ◾ Contents Chapter 2 ◾ Optimization Techniques for Front End, Content, and Back End 25 BACK-END OPTIMIZATION 26 Check for Any Sitemap Errors 27 Check for Any Console Errors 27 Clean Code 28 Clean URL 28 Crawlability 28 Optimizing Database 29 Making Use of Web Hosting Service 30 FRONT-END OPTIMIZATION 31 Keep Site Speed in Mind 31 Make Use of Browser Caching 32 Optimize CSS 32 Optimize Images 33 Brotli and gzip Compression 34 Manage Third-Party JS 34 Prefetching 35 FRONT-END TESTING 36 Types of Front-End Testing 37 How to Create a Front-End Testing Plan 38 Front-End Performance Testing Tools 38 CONTENT OPTIMIZATION 40 Optimizing Text 41 Optimizing Images 42 Optimizing Videos 43 Optimizing News 44 ADDITIONAL OPTIMIZATION TIPS 47 Always Backup Your Site 47 Optimize Your Images before Uploading 48 Use a CDN to Improve Page Speed 48

📄 Page 8

Contents ◾ vii Test Often 48 Optimize for People 48 Keep Mobile in Mind 49 CONCLUSION 49 Chapter 3 ◾ Web Performance and Speed 51 CONTENT DELIVERY NETWORKS 52 What Is a Content Delivery Network? 52 How Do Content Delivery Networks Work? 53 Benefits of Using a CDN 54 How to Pick the Perfect Content Delivery Network? 55 Nature of the Project 55 Budget in Hand 56 Required Features 57 Popular Content Delivery Networks 57 CloudFlare 58 Google Cloud CDN 58 StackPath 59 KeyCDN 59 Amazon CloudFront 60 CacheFly 60 Imperva Incapsula 61 Jetpack by WordPress 61 Sucuri 62 Rackspace 62 Fastly 63 MetaCDN 63 Akamai 64 CDN77 64 Netlify Edge 65 jsDelivr 65

📄 Page 9

viii ◾ Contents Hostry 66 Swarmify 67 Cloudinary 67 USING CACHING FOR WEB PERFORMANCE AND SPEED 68 What Is Caching for the Web? 69 Browser Cache 69 Site Cache 70 Server Cache 71 Importance of Web Caching for Speed 72 Implementing Web Caching 73 Caching Operations 74 Useful Tips Related to Web Caching 75 CONCLUSION 76 Chapter 4 ◾ Conversion Rates: Localization and SEO- Specific Concerns, On-Page Optimization 79 LOCALIZATION 84 Mistakes to Avoid 87 Localization Does Not Mean Translation 87 Insufficient Multimedia Localization 88 Lack of Data-Driven Analysis 88 Lack of Culturally Sound Adaptation 89 Adaptation of Multilingual Service 90 Ignoring Design Considerations 91 Ignoring International SEO 92 SEARCH ENGINE OPTIMIZATION (SEO) 93 Create Audience-Oriented Content 93 Keywords, Meta Description, and Titles 94 URLs 95 ALT Tags 97 One Language Per Page Rule 98 CONTENT THREATS 99

📄 Page 10

Contents ◾ ix TECHNICAL THREATS 100 CONCLUSION 102 Chapter 5 ◾ Measurement and Analysis: Analytics Tools and Measuring Web Performance 103 WEBSITE ANALYTICS SERVICE BEST PRACTICES 106 Do I Need Web Analytics for My Website at All? 108 TYPES OF WEBSITE ANALYTICS 109 User Analytics 109 Content Analytics 110 Behavioral Analytics 110 Traffic Analytics 110 Acquisition Analytics 111 Social Media Analytics 111 WEB ANALYTICS PLATFORMS 112 HOW DO I CHOOSE THE RIGHT WEB ANALYTICS TOOL FOR MY WEBSITE? 120 Start by Drafting a Solution Features Wish List 121 Define Your Targets 121 Analytics Data 122 Technical Requirements 122 Legal Requirements 122 Design and Export Capabilities 122 Professional Support 123 Integrations 123 Demonstration or Trial 123 Pricing 124 HOW TO READ ANALYTICS 124 Acquisition 125 Behavior 125 Conversions 126 CONCLUSION 127

📄 Page 11

x ◾ Contents Chapter 6 ◾ Other Measures: File Compression, Minification, Graphics Optimization, Databases, Redirects, and Hotlinks 129 IMAGE OPTIMIZATION 130 JAVASCRIPT PERFORMANCE 133 VIDEO OPTIMIZATION 136 MINIFICATION 140 DATABASES 141 MySQL 144 PostgreSQL 145 MongoDB 146 REDIRECTS 147 When to Use Redirects 148 HOTLINKS 149 How to Prevent Hotlinking 149 Chapter 7 ◾ Server-Side Optimization 153 NGINX 155 The Backlog Queue 156 File Descriptors 157 Worker Processes 157 Keepalive Connections 158 Access Logging 158 Sendfile 158 Monitor Your Nginx 159 LITESPEED 159 Apache Compatibility 160 Event-Driven Architecture 160 Security 160 Cost-Effective 161 Control Panel Plugins 161 Virtual Host Templates and Web Admin Console 161

📄 Page 12

Contents ◾ xi Per-IP Throttling and SSL Renegotiation Protection 161 Brute Force Protection for wp-login.php 161 Reduced Hardware Costs 161 APACHE 162 OPERATING SYSTEMS 166 Linux 167 The CPU 169 Random-Access Memory (RAM) 169 System Installation Optimization 169 File System Optimization 170 Kernel Parameter Optimization 170 Windows 171 Speed 172 Search and Organization 172 Safety and Security 173 Interface and Desktop 173 Taskbar Menu 173 PHP OPTIMIZATION 174 Single and Double Quote Usage Matters 175 Close or Unset Variables 176 Optimize SQL Queries 177 Minify Your CSS and JavaScript 177 Use a CDN 177 Monitor PHP Performance 178 CONCLUSION, 179 INDEX, 187

📄 Page 13

(This page has no text content)

📄 Page 14

xiii Acknowledgments There are many people who deserve to be on this page, for this book would not have come into existence without their support. That said, some names deserve a special mention, and I am genuinely grateful to: • My parents, for everything they have done for me. • My siblings, for helping with things back home. • The Parakozm team, especially Aruzhan Nuraly and Madina Karybzhanova, for offering great amounts of help and assistance during the book-writing process. • The CRC team, especially Sean Connelly and Jessica Vega, for ensur- remains perfect throughout. • Reviewers of this book, for going through the manuscript and pro- viding their insight and feedback. • Typesetters, cover designers, printers, and everyone else, for their part in the development of this book. • All the folks associated with Zeba Academy, either directly or indi- rectly, for their help and support. • The programming community in general, and the web development community in particular, for all their hard work and efforts. Sufyan bin Uzayr ing that this book’s content, layout, formatting, and everything else

📄 Page 15

(This page has no text content)

📄 Page 16

xv About the Author Sufyan bin Uzayr is a writer, coder, and entrepreneur with more than a decade of experience in the industry. He has authored several books in the past, pertaining to a diverse range of topics, ranging from History to Computers/IT. Sufyan is the Director of Parakozm, a multinational IT company specializing in EdTech solutions. He also runs Zeba Academy, an online learning and teaching vertical with a focus on STEM fields. Sufyan specializes in a wide variety of technologies, such as JavaScript, Dart, WordPress, Drupal, Linux, and Python. He holds multiple degrees, including ones in management, IT, literature, and political science. Sufyan is a digital nomad, dividing his time between four countries. He has lived and taught in universities and educational institutions around the globe. Sufyan takes a keen interest in technology, politics, literature, history, and sports, and in his spare time, he enjoys teaching coding and English to young students. Learn more at sufyanism.com.

📄 Page 17

(This page has no text content)

📄 Page 18

1DOI: 10.1201/9781003203735-1 C h a p t e r 1 What Web Performance Is and Why It Matters IN THIS CHAPTER ➢ Explaining the concept and main objectives of web performance ➢ Answering the “why it matters” question about websites ➢ Giving reasons why web monitoring is the key to success With so much business being conducted around the world online, nowa- days, the success equation of presents itself quite simply: you have to learn how to handle performance pressure and incorporate fine-tuned technolo- gies smartly into your business. And while the pressure just keeps growing

📄 Page 19

2 ◾ Web Performance Optimization and there is nothing much to do but to adapt and deliver, the technology part leaves plenty of room for leverage and creativity. And in today’s hyper globalized and over-competitive world, there is no better way to reach and attract your potential audience/customers from anywhere in the world than through a website. Yet there is a tricky part: for the website to make a positive impact, it has to be simply outstanding. With businesses pouring money into launching and constantly tun- ing the company website, it helps to know what’s too much or too little to spend on professional web solutions. Thus, according to WebFX,1 web developing and design prices range from $1000 to more than $100,000. There is a great variety of digital marketing companies that can provide you with a custom-made website. The standard design is expected to fea- ture database integration, obligatory e-commerce functionality, and sev- eral services that could be as complex as interactive games, background music, and videos that attract attention and glue you to the site, as well as online store setup and virtual shopping cart. If you manage an enterprise, the advanced design offers a solution that matches your company’s size, budget, and requests. It also maximizes your conversion rate and custom- ers’ return, which is critical for striving in a competitive market. Making sure you know exactly what features you do not need will help you to save for further investment in website maintenance that can cost from $400 to $60,0002 and include website security and updates to improve functional- ity, reduce errors, and prevent viruses. WEBSITE PERFORMANCE IS KEY TO CUSTOMER RETENTION AND ACQUISITION It should be clear by now that delivering a performant site is vital for an ambitious business. However, there could be cases when your site may have the best products, services to offer, and unique content on the web, but if it is even slightly glitchy or boring, you could end up hurting your brand and driving potential as well as loyal customers right in the hands of the competition. Performance is a big deal, especially when it comes to matching technology with the marketing vision of your own. The website you launch therefore has to represent your spirit and make sense of what your brand, product, or service hopes to become someday. The “wrong” 1 https://www.webfx.com/website-design-pricing.html, WebFX 2 https://www.webfx.com/website-design-pricing.html, WebFX

📄 Page 20

What Web Performance Is? ◾ 3 website has to be viewed as a liability and dealt with accordingly. The “right” website will manage to transmit a clear sense of purpose. Keeping the vision and standards of operation on a high point results in capturing bigger market shares, increased efficiency, and profit. On the other hand, letting go of the site’s performance issues and delays will cost you the very precious audience to the point where one day your website might be shut with its doors bolted permanently. WEBSITE PERFORMANCE IS THE OBJECTIVE In the early days, it was enough for a company to just draft a website that vaguely resembled a well-done online catalog. Sites were built with the aim to generate more views and consequently more sales. They were mea- sured using quantitative tools like Google Analytics that launched on the November 14, 2005. At that early stage, website owners were trying to fig- ure out how well their sites were performing by adding adequately ancient “visitors’ counters” at the bottom of the page. Those times have surely passed, but nowadays website owners still struggle with website perfor- mance measurement. In recent years, an alternative evaluation to judge each new website as the objective on its own, looking at the site’s quality and interactive performance, was introduced. Web performance objective has shifted from calculating viewers to make sure the website is fast, offers reassuring feedback, has smooth ani- mations, and provides continuous, strategically an important service to the business. WEB PERFORMANCE IS USER EXPERIENCE Fast page load time equals more visitors willing to return and more people trusting the website. Ideally, viewers expect pages to load in 2 seconds, and after 3 seconds, up to 40% of users will abandon your site.3 Similar results have been presented by major sites like Amazon, which found that 100 milliseconds of additional page load time decreased sales by 1%,4 and also Google, who lost 20% of revenue5 due to half a second increase in webpage load time. Akamai has also summarized that 75% of online shoppers who 3 http://www.mcrinc.com/Documents/Newsletters/201110_why_web_performance_matters.pdf, Gomez 4 ht t ps://w w w.forbes .com/sites/orei l ly med ia /2014/01/16/web-per forma nce-is-user- experience/?sh=1bd5c0c45a52, Forbes 5 https://perspectives.mvdirona.com/2009/10/the-cost-of-latency/, Perspectives