Quality and Performance report

https://www.fieldengineer.com/
Report generated on Aug 2, 2018 10:58:26 AM
Download report
SIMULATED VISITOR: Chrome London 10.0/2.0Mbps (Latency: 28 ms) Edit

Requests

71

Weight

19.36MB

HTML CSS Scripts Images Others
Timeline / Waterfall

First Byte

0.49sec

Start Render

1.87sec

Fully loaded

44.39sec


Browser warnings 0OK
HTTP/2 Ready: 67%
Speed Index: 18529

Technologies :

Google Analytics

Nginx

Piwik

TrackJs

Twitter Bootstrap

Twitter Emoji (Twemoji)

WordPress

Yoast SEO

jQuery

PHP


Share this report by email

Feel free to share this report with your collaborators, by copying the URL from the address bar,
or by clicking below:

Share the report

Tips and best practices:

Things to improve

Data amount 

0/100

Some resources are too heavy

This page contains a file with a size greater than 1MB:

Too heavy files should not be loaded on a web page. Be sure you need this resource to load the page. You should probably consider some of the following actions:

  • compress the resource
  • load the resource asynchronously
  • fragment the resource and distribute it over multiple requests


 
Read more
Data amount 

0/100

Reduce the page weight (19.4MB)

The page weight is too high, slowing down its display, especially on low speed connections. This can lead to frustration for users paying for data (see whatdoesmysitecost.com).

Evaluate the Weight of my Web Page

In February 2016, the average weight of 100 most visited websites in the world was 1,38MB.

How to reduce the weight of my page?

You can report to our "Data amount" category to discover the possible optimizations in your case. Images are often involved.
Moreover, make sure to build your web pages in order to load data that is essential to the user experience (rendering optimization of the critical path).
For other contents (social networking plugins, advertising, content at the bottom of the page ...), it is better to delay the loading (asynchronous, lazy-loading ...), so they don't override priority contents.

We strongly recommend that you define performance budgets before you carry out your web projects. These budgets can be settled through the Dareboost monitoring feature.


We have established the weight distribution of the page by resource type:

  • Others : 91,91% of total weight
  • Images : 5,78% of total weight
  • JavaScript : 1,46% of total weight
  • Font : 0,43% of total weight
  • CSS : 0,33% of total weight
  • Texts : 0,08% of total weight
  • JSON : 0,01% of total weight

Here is the weight of the 10 heaviest resources over the network, and that are necessary to load the page:


 
Read more
Data amount 

0/100

5 images are resized on browser side

Images must not be delivered larger than they are actually displayed to avoid loading unnecessary data.

Resizing images explained

Resizing images on browser side to reduce their rendering size is not recommended.

For instance, if your image is set to render at 300px by 300px on a particular page, don't upload the original 1000px by 1000px version of that image to your page. Instead, resize/crop the image to fit the display size and then upload it to your site to decrease the page weight and loading time.

Using images with responsive designs or retina screens?

Responsive website designs and retina screens do not justify an image resizing. Even in such cases, some methods exist to deliver your pictures to the right size. We recommend reading the following resources:

Don't resize the following images:

On this page, 9 images are resized by less than 35%. This can be consistent in a Responsive Web Design website, so this best practice does not penalize the following resources, but please make sure that they do not affect the page performance:


 
Read more
Browser rendering 

50/100

Defer parsing of JavaScript

JavaScript can significantly slow down a page display, especially if it is necessary to download an external script.

Defer the use of JavaScript as much as possible to provide a faster start for the page display.

How can I fix this?

First of all, distinguish what portions of your JS is critical and must be loaded as soon as possible, and put them in a specific external file. Keep this file as streamlined as possible, and defer the parsing or execution of all other JS files (learn more).

Use one of the methods below to defer parsing for external JavaScript files:

  • use the async attribute;
  • use the defer attribute;
  • append the script to the DOM in JavaScript during the onload event;
  • make sure your scripts are placed at the bottom of the page (ideally at the end of the body).

The WP Rocket Wordpress plugin has a "Load JavaScript deferred" option, feel free to try it!

99.7KiB of JavaScript is parsed during initial page load. Defer parsing JavaScript to reduce blocking of page rendering.


 
Read more
Security 

0/100

The Content Security Policy is missing

Protect you website from cross-site scripting (XSS) attacks by setting up a restrictive Content-Security-Policy.

XSS attacks explained

XSS attacks are a type of attack in which malicious data is maliciously added to websites. The number of vulnerabilities allowing these attacks is quite large, which is why it is as useful to prevent them as to limit their harmful effects.

You can protect your pages against these attacks and their effects by restricting execution to code portions either legitimized by the domain to which they belong or by a unique integrity token. The code that does not corresponding to this security policy will not be executed and the user will be informed.

You can learn more about XSS attacks on the Open Web Application Security Project (OWASP) Website.

Configure a "Content-Security-Policy" (CSP) HTTP header

Set up a "Content-Security-Policy" (CSP) HTTP header to prevent or limit damage caused by an XSS attack. To specify a security policy configure your server so the response of the first resource contains the "Content-Security-Policy" HTTP header.

Here's an example:

Content-Security-Policy: script-src 'self' https://apis.google.com

In this case, only scripts coming from the current host or https://apis.google.com will be executed.

Read more about the CSP HTTP header. You can also look at the CSP directives specification.

Please, be careful, if the header is misconfigured, some of your content, scripts, or styles may be blocked. That could cause unwanted side effects. Moreover, the restrictions apply to all pages of the website. We recommend you test the different pages of your website before deploying this header in your production environment.


No Content Security Policy on this page: it is more easily exposed to XSS attacks.


 
Read more
Browser rendering 

0/100

You can save one script execution

A library or an external script are usually intended to be called once per page. However, the use of widgets can lead to several useless executions.

Duplicate scripts

It is common to see scripts used multiple times within the same page. The most common case is the integration of social networks widgets. It can be useful to find them several times on the page. That is not a bad practice, however you should be careful that those scripts don't slow down your page.

What happens when a script is included 2 times in the code? How many times is it loaded? Parsed? Executed?

Most modern web browsers download only once a script included 2 times. An exception persists: Firefox, which will load the resource as many times as mentioned if no effective caching policy is configured.

Apart from this exception, performance issues come during the parsing and execution of the scripts. Indeed, if a script is placed three times in the code, it will be parsed and executed 3 times, on all browsers.

Do not hesitate to read this article on that topic.

How to fix it?

There is a solution to use a script several times without parsing and executing more than once. You need to write some JavaScript code that checks if the script is present. If the script is already included, it just uses it, otherwise it injects it and uses it.

Consider the following example with the Facebook widget, described in the article. Whenever you want to integrate this functionality into your page, it is necessary to include the following code:

(function(d, s, id){
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) {return;}
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/sdk.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));

The bold line checks the presence of the script in the document. So the script is included, parsed and executed only during the first call in the page. Other calls will fall in the case of the bold line, and therefore will just use the script that is already included and executed.


The following script is parsed and executed multiple times on your page:


 
Read more

Did you know?

Security 

SSL Certificate

Your SSL certificate will expire on 02/07/2019. Update your certificate before that date.

What happens if my certificate expires?

Letting a certificate expire can have consequences for end users who will then see many error or alert messages while browsing the site, warning them of possible frauds, identity thefts or traffic interceptions. These alerts can have a very negative impact on the user's perception of the visited domain.


 
Read more
Accessibility 

No <noscript> tag is detected

When a web page uses scripts, it is advised to set at least one noscript tag. It is required to display a message when JavaScript is disabled by the user.

<script  type="text/javascript">
document.write('Hello World!')
</script>
<noscript>Your browser does not support JavaScript!</noscript>


 
Read more
jQuery 

More informations about jQuery performance

jQuery is the most used JavaScript library. Upgrade your website performance respecting the jQuery best practices. We recommend that you learn the basics of the jQuery performance, reading the following link: http://learn.jquery.com/performance/.


 
Read more

This page contains 120 links

Two kind of links exist:

  • Internal links that refer to pages with the same domain name;
  • External links that point to other websites (must be relevant and point towards quality content).

If you reference many links, you can ask the SEO crawlers to consider only some of them, by adding the rel=nofollow attribute to the irrelevant ones (e.g., advertisements).

Here is the distribution of 120 links present in the page:

  • 85 internal links (70,83%)
  • 35 "follow" external links (29,17%)
  • No "nofollow" external link (0,00%)


 
Read more
Security 

Your server should be able to communicate with HTTP while it uses a HTTPS connection

Take precautionary measures against attacks like "man in the middle" by making sure to only communicate in HTTPS with the server.

The HTTP Strict Transport Security (HSTS) Header

When you communicate with a server through a secure connection, every sent request towards this server should use the HTTPS protocol. The HTTP HSTS header allows to indicate to the browser that all the requests sent to the domain concerned must be done via HTTPS. If the URL is presented under "http://...", the web browser is automatically going to replace it by "https://...".

However, we advise you to not set this header unless your entire website serves its resources in HTTPS.

For further information, you can read this article.

No HSTS header has been detected on this page.


 
Read more
Security 

46 resources on this page are for public use

By default, the browser accepts to perform AJAX requests, or to retrieve web fonts, only on the same domain name of the page. So a font provided by toto.com can only be used by the pages of toto.com. This prevents misuse of your resources by any site.

Some resources are public, and explicitly want to be available to everyone (eg Google Fonts). In this case, the HTTP header Access-Control-Allow-Origin can be used with the value "*". You should, however, use this property if your resource has aimed to be used by the greatest number. Otherwise, we recommend that you keep the default, or set a specific domain name in the "Access-Control-Allow-Origin" HTTP header.

You should be aware of the following resources, that use a Access-Control-Allow-Origin: * HTTP header. Make sure they are actually intended to be used by pages from all domain names:

Resources from "fieldengineer"
Resources hosted by a third-party

It appears these files are hosted by a third-party, so they may not be within your control. However, you should consider any alternative to these resources to improve your page performance.


 
Read more

Well done, these best practices are respected

Browser rendering 

100/100

Your HTML response is not too heavy

Why reduce the code amount of a page?

Before a web page can be displayed, the browser must, among other things, download it, parse it and model it into a document that can be understood by the rendering engine. If the amount of code contained in the page is too large, these steps are slowed down and the rendering is delayed.

How to reduce the amount of code?

Your HTML response should contain only the information that is immediately necessary to display the visible area of the page. Move inline information to external files (JS for scripts, CSS for styles, asynchronous queries for additional content) and simplify the HTML structure of your page.


 
Read more
SEO 

100/100

Your <img> tags use an alt attribute, but 2 are empty

Moreover, the alt attribute is also an important criterion for SEO. Indeed, search engines crawlers cannot parse graphic contents. That is why they use the alternative text to return consistent results, like in Google images.

<img src="product.jpg" alt="My product description"/>

The alt attribute is used in several cases unrelated to SEO:

  • When a screen reader is in use for accessibility purposes;
  • While image is loading, particularly for slow connections;
  • When the image file is not found.

You have 18 img tags and they all have the alt attribute.

Warning, you should also note that 2 of your images contain an alt attribute, but they are empty:

  • <img src='https://www.fieldengineer.com/wp-content/uploads/2017/08/ET_logo-96x96.jpg' alt=''/>
  • <img src='https://www.fieldengineer.com/wp-content/uploads/2017/08/inc-logo-160x96.png' alt=''/>

If nothing seems appropriate for describing an image, you might set an empty text. We advise you to make sure the majority of your images define a relevant text. Read the W3C recommendations here.


 
Read more
Cache policy 

100/100

You do not use too long inline scripts

Any script with a significant size should let the browser cached them in order to reduce loading time/improve performance of your returning visitor.

Inline scripts / cache policy

"inline" scripts allow to integrate easily small portions of scripts directly in the HTML code. Example:

<script type="text/javascript">
    (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']...,'/analytics.js','ga');
    ga('create', 'UA-11111111-1', 'mywebsite.com');
</script>

By doing so, you avoid making a request to the server to retrieve the resource. So inline scripts represent a performance gain if you want to integrate small scripts.

However, once a script has a fairly substantial size, we advise you to outsource it and perform a request to retrieve it. So you will benefit from the cache mechanism.

What should I do?

Outsource your scripts with more than 1500 characters in one or more separate files.


 
Read more
SEO 

100/100

This page defines <h1> and <h2> tags

We recommend putting page keywords in at least the h1 and h2 tags. Search engines use the h1, h2, and h3 tags for SEO purposes.
This page contains:

  • 1 <h1> element(s)
  • 1 <h2> element(s)
  • 23 <h3> element(s)


 
Read more
Compliance 

100/100

No frameset, frame and noframes tags detected

These tags are obsolete, due to several issues related to the navigation consistency, SEO or browsers' bookmark features for example.

None of these tags is detected on this page.

The use of the iframe tag is prefered.


 
Read more
SEO 

100/100

This page uses only standard image formats

The images that use a non-standard format may not be indexed by search engines.

Only these image formats are considered standard on the web: jpeg, jpg, png, gif, svg, ico, webp. You should consider an alternative to any other format.

Moreover, remember to treat the text around your images: some search engines analyze approximately the 10 words preceding and following the image in order to add a context to the image.


 
Read more