Quality and Performance report

Report generated on Feb 10, 2019 12:29:51 AM

Not so bad!
But still far from perfection






See your priorities


SIMULATED VISITOR: Chrome Paris 8.0/1.5Mbps (Latency: 50 ms) Edit





HTML CSS Scripts Images Others
Timeline / Waterfall

First Byte


Start Render


Fully loaded


Browser warnings 0OK
HTTP/2 Ready: 100%
Speed Index: 845

Technologies :

Google Font API

WP Rocket




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

Browser rendering 


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!

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

Read more


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


Each form must define a submit button

HTML forms are used to send data. For accessibility purposes (eg using a screen reader), all your forms must include a submit button.

How to specify a submit button?

You can send the form data using two kind of elements:

  • button
  • input, with the type attribute using one of these values: submit, image or button

The following forms should define a button:

  • <form method="get" class="td-search-form" action="https://propulsatuvida.com/">

Read more


1 cookie is not secure

A cookie sent from the server to a web browser via the HTTPs protocol should only transit on a secure connection (except for some specific cases).

HTTP cookies

HTTP cookies are set by the server to the web browser via the Set-Cookie HTTP header. Then, the browser transmits the cookies to the server for the next requests by using the Cookie HTTP header. When the server uses a secure connection (HTTPs), the cookie probably contains some sensitive data: you have to guarantee that the cookie cannot be exploited on an insecure connection.

The Secure directive

By adding the Secure instruction in the Set-Cookie HTTP header, the server informs the browser that it is allowed to transmit the cookie over secure connection only. Read this blog post to learn more.

Caution: Ensure that the HTTP to HTTPS redirect is activated on your website. Otherwise, the Secure cookie may not be sent on HTTP request.

The following Cookies are not secure, you should add the Secure instruction in the Set-Cookie HTTP header:


  • set-cookie: SERVERID87219=272069|XF9wh|XF9wh; path=/

Read more


This page is exposed to "clickjacking" type attacks

Keep malicious people from integrating your pages into their websites.

Clickjacking explained

This kind of attack happens when your page gets integrated with a malicious website via <frame> or <iframe> tags. By doing this, attackers can persuade users that they are on your own page when they are not. The unsuspecting user may enter personal information that is visible on and thus vulnerable to the malicious website.

To avoid this, always indicate which domains have permission to integrate your pages.

How to prevent clickjacking?

There are two main ways to prevent that behavior.

1/ Configure a "X-Frame-Options" HTTP header. Configure your server so the main resource response includes the "X-Frame-Options" HTTP header.

Three values may be defined:

  • DENY to prevent any frame or iframe from integrating the page;
  • SAMEORIGIN to authorize only frames from the same domain name;
  • ALLOW-FROM uri to indicate the domains allowed to integrate a page into frame (however is not compatible with some browsers)
  • 2/ Define an explicit frame-ancestors directive into a Content-Security-Policy HTTP Header. "frame-ancestors" directive is a newer, hence supported by fewer browsers, approach that will allow your website to authorize multiple domains instead of only the current origin. Setting this directive to 'none' is similar to X-Frame-Options: DENY.

    Which approach to choose? If you only have the current domain to allow, do set up the two security features, for better compatibility with older browsers. If you want to allow multiple domains, you should only implement the frame-ancestors security policy.

    Neither the "X-Frame-Options" HTTP header nor the "frame-ancestors" security police are configured on this page; you are more likely to be exposed to clickjacking.

    Read more


    10 CSS properties are overridden by shorthands

    CSS has some pitfalls that can cause side effects on your styles.

    Override CSS properties

    When a property is used 2 times within a CSS rule, the second one overrides the first.
    CSS provides some shorthand properties, that can leads to some mistakes. For instance, the "border" property is applied to all borders of an element, avoiding the use of all "border-top", "border-right", "border-left" and "border-bottom" properties.

    For intance:

    .myClass {
    border:5px solid; // border will take again the default color

    "border-color" is overridden by the "border" shortand property.

    Avoid side effects

    The use of shorthand properties is risky, because it comes with an implicit override. If the resulting style on your page is the desired one, you should delete the overridden property (it will also reduce the file size).

    The following files include a property overriden by a shortand property:


    • .vc_grid-loading: "animation" resets "animation-fill-mode" property set earlier (line 1, col 532426)
    • .vc_grid-loading:after: "animation" resets "animation-fill-mode" property set earlier (line 1, col 532426)
    • .vc_grid-loading:before: "animation" resets "animation-fill-mode" property set earlier (line 1, col 532426)
    • .vc-woocommerce-add-to-c[...]-item-mini .vc_wc-load-add-to-loader: "animation" resets "animation-fill-mode" property set earlier (line 1, col 580638)
    • .vc-woocommerce-add-to-c[...]mini .vc_wc-load-add-to-loader:after: "animation" resets "animation-fill-mode" property set earlier (line 1, col 580638)
    • .vc-woocommerce-add-to-c[...]ini .vc_wc-load-add-to-loader:before: "animation" resets "animation-fill-mode" property set earlier (line 1, col 580638)
    • .td-social-style3 .td_social_type .td_social_button: "border" resets "border-color" property set earlier (line 1, col 1302842)
    • .td-social-style4 .td_social_type .td_social_button: "border" resets "border-color" property set earlier (line 1, col 1304302)
    • and 2 others

    Read more


    128 CSS selectors are duplicated

    Using several times the same selector for several declarative blocks within a single CSS file can affect the readability and maintainability of the code. It is also an optimization opportunity: by grouping these elements within a single rule, you will reduce the file size and optimize the rendering times.

    The CSS Object Model (CSSOM)

    The CSS rules allow to select elements from the HTML code in order to apply styling properties.

    In order to do that, the browser constructs its own model of the CSS markup it has fetched: the CSS Object Model. This transformation takes several steps: reading the file, converting the strings of text into browser tokens, transforming this tokens into objects with properties and rules and organizing the elements in a tree-like model. These operations will take place more quickly if the CSS code is written in a simple and non-redundant way.

    How to improve the CSS rules?

    For maintenance as well as performance, you have to reduce the number of rules contained into your CSS files and group rules whenever it’s possible. For instance, the following rules:

    .myClass {
    margin: 0;
    border: 1px solid black;

    Should be merged into a single one:

    .myClass {
    margin: 0;
    border: 1px solid black;

    If the duplication is the result of a legacy process or is justified for maintenance reasons, you can consider using a CSS minification tool able to do automatically this improvement.

    You can save 7577 characters. The following files define the same selector in different rules:

    https://propulsatuvida.com/ (inline 0)

    • .wpb_button (4 times)
    • body (3 times)
    • textarea (2 times)
    • .widget (2 times)
    • a (2 times)
    • img (2 times)
    • .wpb_btn-inverse (2 times)
    • .td-main-content-wrap (2 times)
    • and 4 others


    • .vc_toggle_simple .vc_toggle_icon (5 times)
    • .vc_toggle_title (3 times)
    • .vc_toggle_simple .vc_to[...]oggle_simple .vc_toggle_icon::before (3 times)
    • .vc_toggle_round .vc_toggle_icon (3 times)
    • .vc_toggle_rounded .vc_toggle_icon (3 times)
    • .vc_toggle_square .vc_toggle_icon (3 times)
    • .vc_btn3.vc_btn3-color-white.vc_btn3-style-outline (2 times)
    • .tds-social6 .tdm-social-item (2 times)
    • and 108 others

    Read more


    Explain the purpose of each form field

    Clarify the purpose of each field will facilitate the user experience on your website.

    A form is composed of several fields that must be the most explicit possible for the user to quickly understand their function.

    Define a label

    You should prefer using the label tag:

    <label for="name">Fill your name:</label>
    <input id="name" type="text" name="name">

    Otherwise, you can use the aria-label or the title (not supported by all screen readers) attributes. Read more. Note that using the placeholder attribute is insufficient.

    This page contains 3 fields without any explanations:

    • <input id="td-header-search-mob" type="text" value="" name="s" autocomplete="off">
    • <input id="td-header-search" type="text" value="" name="s" autocomplete="off">
    • <textarea class="tdw-css-writer-editor td_live_css_uid_1_5c5f461ed3f77">

    Read more


    Block access to the entire page when an XSS attack is suspected

    Make sure that the user’s browser does all it can to prevent an XSS-type attack.

    XSS attacks

    An XSS-type attack (XSS stands for Cross-Site Scripting) aims at injecting content into the page.

    Recent browsers have an integrated protection against XSS attacks. However, this protection can be disabled. To prevent any harm to the user, we recommend that you force the activation of the XSS Protection, and should an XSS attack be detected, block access to any of the page content.

    Solution: configure an "X-XSS-Protection" HTTP header

    Add the "X-XSS-Protection" HTTP header with "1; mode=block" as value (1 to indicate the activation, and mode=block to indicate that the entire page must be blocked if a problem occurs).

    The XSS protection is disabled on this page.

    Read more


    The !important declaration is used 1117 times

    If you abuse of this declaration, you should consider a review of your CSS code. We tolerate 10 occurrences of the !important declaration before penalizing your score.

    Here are the !important detected:

    https://propulsatuvida.com/ (inline 1)

    • img.wp-smiley, img.emoji {display: inline!important} (line 1, col 25)
    • img.wp-smiley, img.emoji {border: none!important} (line 1, col 50)
    • img.wp-smiley, img.emoji {box-shadow: none!important} (line 1, col 72)
    • img.wp-smiley, img.emoji {height: 1em!important} (line 1, col 98)
    • img.wp-smiley, img.emoji {width: 1em!important} (line 1, col 119)
    • img.wp-smiley, img.emoji {margin: 0 .07em!important} (line 1, col 139)
    • img.wp-smiley, img.emoji {vertical-align: -0.1em!important} (line 1, col 164)
    • img.wp-smiley, img.emoji {background: none!important} (line 1, col 196)
    • img.wp-smiley, img.emoji {padding: 0!important} (line 1, col 222)

    https://propulsatuvida.com/ (inline 0)

    • body {visibility: visible!important} (line 1, col 914)
    • .td-header-wrap .td-drop-down-search .btn {margin: 0!importa... (line 1, col 5133)
    • .td-header-wrap #td-header-search {border-color: #eaeaea!imp... (line 1, col 5653)
    • .td-header-wrap .td-header-menu-wrap-full, .td-header-wrap .... (line 1, col 6126)
    • .td-header-wrap .td-header-menu-wrap-full, .td-header-wrap .... (line 1, col 6158)
    • .header-search-wrap .td-icon-search {color: #fff!important} (line 1, col 6216)
    • .td-header-sp-top-menu {padding: 0!important} (line 1, col 8336)
    • .td-header-sp-top-menu {display: none!important} (line 1, col 8428)
    • and 3 others


    • .wp-block-media-text.is-stacked-on-mobile {grid-template-col... (line 1, col 19981)
    • .kk-star-ratings .kksr-stars, .kk-star-ratings .kksr-stars .... (line 1, col 26875)
    • .tdm-header-style-1 .td-header-sp-recs, .tdm-header-style-2 ... (line 1, col 28879)
    • .tdm-header-style-1 .td-header-sp-recs, .tdm-header-style-2 ... (line 1, col 29079)
    • .tdm-header-style-1.td-header-background-image .td-header-sp... (line 1, col 29338)
    • .tdm-header-style-1.td-header-background-image .td-header-sp... (line 1, col 29614)
    • .tdm-header-style-1 .td-a-rec-id-header .adsbygoogle, .tdm-h... (line 1, col 30395)
    • .homepage-post.single_template_7 .tdm-header-style-1 .td-hea... (line 1, col 34304)
    • and 1089 others

    Read more


    Disable the auto detection of resource type

    Protect yourself from malicious exploitation via MIME sniffing.

    MIME-Type sniffing explained

    Internet Explorer and Chrome browsers have a feature called "MIME-Type sniffing" that automatically detects a web resource's type. This means, for example, that a resource identified as an image can be read as a script if its content is a script.

    This property allows a malicious person to send a file to your website to inject malicious code. We advise you to disable the MIME-Type sniffing to limit such activity.

    How to prevent MIME-Type sniffing

    Configure a "X-Content-Type-Options" HTTP header. Add the "X-Content-Type-Options" HTTP header in the responses of each resource, associated to the "nosniff" value. It allows you to guard against such misinterpretations of your resources.

    On this page, you should configure the following resources, that risk being misinterpreted:

    Resources from "propulsatuvida"
    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

    Did you know?


    SSL Certificate

    Your SSL certificate will expire on 05/04/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

    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
    Data amount 

    This page does not load too much data (387kB)

    A too high page weight slows down the 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:

    • CSS : 37,21% of total weight
    • Font : 31,25% of total weight
    • JavaScript : 22,92% of total weight
    • Images : 5,16% of total weight
    • Texts : 3,31% of total weight
    • JSON : 0,15% 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

    This page contains 8 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 8 links present in the page:

    • 8 internal links (100,00%)
    • No "follow" external link (0,00%)
    • No "nofollow" external link (0,00%)

    Read more

    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

    8 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:

    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 


    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


    No empty element detected

    <p>, <li>, <button>, <legend>, <caption>, <figcaption> and <quote> elements must not be empty because if they are, some screen readers will have difficulties interpreting their presence.

    Remove these empty elements from you code or decorate them with the aria-hidden attribute so that the screen readers ignore them.

    <p aria-hidden="true"></p>

    Read more


    Your <img> tags use an alt attribute

    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 4 img tags and they all have the alt attribute.

    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 


    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">
        ga('create', 'UA-11111111-1', 'mywebsite.com');

    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


    <noscript> tag detected

    This page uses noscript tag. It allows to display a message when JavaScript is disabled by the user.

    Read less


    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)

    Read more