Striking a balance among non-functional requirements

Building a website requires striking a balance between non-functional but essential features like performance and security. The article When Design Best Practices Become Performance Worst Practices lists 3 design best practices which are performance worst practices, solutions to fix them and some interesting performance facts:

• Images comprise more than half of a typical page’s total payload, and much of this bulk is unnecessary. Image compression is a basic performance technique that allows developers to reduce this payload
• Progressive image rendering improves perceived load time because the user receives visual feedback earlier than with a baseline JPEG.
• According to Google, pages should ideally render content above the fold in one second or less, even for smartphones. According to the article, the consensus in the performance community is that if you’re serving your primary content in three seconds or less, you’re doing okay, if not great. Among the top 100 online retailers, the median time to interact (aka TTI, the moment when a page’s primary content renders and becomes interactive) is 5.3 seconds.
• Time to interact (TTI) is taking hold as the performance metric to watch followed by above-the-fold time (AFT) as important KPIs
• Optimize the order in which the page objects render, plus optimize the images and buttons themselves to render progressively. If the CTA (call-to-action) is important, move it to the top.
• Performance should be the responsibility of every person who touches a page, from conception through to deployment. 
• Artificially throttle the connection during the design and test phases.