> ## Documentation Index
> Fetch the complete documentation index at: https://dokumentation.websale.de/llms.txt
> Use this file to discover all available pages before exploring further.

# Loading time and encryption

> Use the PageSpeed tool to reduce requests, minify CSS and JavaScript and control browser caching, and switch the shop entirely to SSL.

Two properties of delivery affect ranking without a single piece of content having to be written: how fast a page loads and whether it is transmitted encrypted. Both come largely set up with the delivery shop, and both can be improved further.

## Improving loading time

Especially on mobile devices, loading time decides whether a visitor stays. Search engines measure it and factor it into the ranking. The PageSpeed tool of WEBSALE V8s addresses three points for this: fewer requests to the server, smaller files and fewer repeated transfers.

### Fewer requests through groupings

To display a page, the browser requests each required file individually, that is every style file, every script, every image. The fewer of these requests are needed, the faster the page is ready.

For this purpose, the PageSpeed tool combines CSS and JavaScript files into groupings with a freely selectable identifier. Each grouping is delivered as a single file. This way you integrate on each page only what that page needs, without it turning into a dozen individual requests.

Guide: JavaScript and jQuery · CSS

### Smaller files through minification

Each grouping is automatically minified when it is provided. Spaces, line breaks and indentation that are not needed for execution are removed. As a result, the files are loaded, read and executed faster.

> [!WARNING]
>
> Only pass non-minified files to the PageSpeed tool. Minifying an already minified file a second time can make it unusable.

### Fewer transfers through browser caching

Returning visitors fetch the same images, styles and scripts again on every visit. If the server tells the browser which files it may take from its own cache, these transfers are no longer necessary.

The catch: if you change a file, the visitor continues to see the old version from their cache. Depending on the file type, you therefore need to weigh how long files should be cached.

For CSS and JavaScript, the PageSpeed tool solves the problem itself. Each grouping gets a fingerprint in the file name. For example, `my_css_group.css` becomes `my_css_group_1234.css`. If a file within the grouping changes, the fingerprint changes, the file name is therefore different, and the browser has to fetch the file again. Unchanged groupings keep their fingerprint and continue to come from the cache. For these files, browser caching is therefore recommended without restriction.

> [!NOTE]
>
> Product data is not affected by this question. It is contained in the HTML of the shop page, and this is marked as not cacheable. A new price is therefore immediately visible on every page call.

For other file types, you decide together with the mail-order retailer. A short duration of, for example, one hour for `.jpg`, `.png` and `.gif` keeps the images available for the duration of a shop visit and still stays up to date.

> [!WARNING]
>
> For files that have to be replaced at a specific point in time, such as banners for tightly time-limited promotions, always change the file name as well. Only a new name forces the browser to load the file.

You set the instructions for this per file type via an `Expires` entry in the `.ws_access.conf` file in the root directory of the domain. Its function corresponds to the Apache configuration file `.htaccess`.

## Encrypting the shop completely

In SSL-Only mode, every page of the shop is transmitted encrypted, not just the checkout. This increases security, it is visible to customers through the padlock in the address bar, and Google ranks encrypted pages higher.

Not only the shop pages are affected. Images, style files and scripts are then also addressed via `https://`. The additional applications such as TopRank, data feeds for price search engines, BackInStockMail and the E-Marketing Manager also support the mode.

After the switch, a call via `http://` leads to a 301 redirect to `https://`. The shop is then no longer accessible unencrypted.

> [!NOTE]
>
> A prerequisite is a separate SSL certificate for the shop. Since V8, all shops have one.

> [!NOTE]
>
> Links generated by the TopRank Manager and the Dataflow Manager are automatically updated daily. After the switch, WEBSALE can also trigger this update immediately.

### Preparation

Anything that is still requested via `http://` after the switch is blocked by the browser or reported as insecure. Before the switch, every such place must therefore be found. Five areas need to be checked:

| Area | What to do |
| - | - |
| Links | only check links without WEBSALE tags |
| Third-party JavaScripts | switch the call to `https://` |
| External applications | switch the call to `https://` and inform the provider |
| Design elements such as graphics, fonts and styles | only check paths without a WEBSALE tag and without a relative path |
| Text maintenance platform | check links and embedded scripts in the text variables |

> [!NOTE]
>
> For all links and paths that WEBSALE generates itself, that is via tags such as `CAT-Link`, `PR-Link`, `PR-Image` or `CAT-AdvNavImage`, `http://` is automatically replaced by `https://`. The same applies to relative paths. You do not need to touch these places.

The same procedure applies to every remaining place: call the address with `https://` in the browser. If it loads, change the call in the template. If it does not load, contact your representative and initially make the change for this place in design test mode.

A fixed target becomes an internal link or gets `https://`:

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
<!-- vorher -->
<a href="http://www.ihre-domain.de/Beispielkategorie123">Ihr Banner</a>

<!-- besser -->
<a href="~CAT-Link(123)~">Ihr Banner</a>
```

A third-party script:

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
<!-- vorher -->
<script type="text/javascript" src="http://www.googleadservices.com/pagead/conversion.js"></script>

<!-- nachher -->
<script type="text/javascript" src="https://www.googleadservices.com/pagead/conversion.js"></script>
```

> [!NOTE]
>
> You do not need to check scripts that are only integrated in the ordering process. The ordering process runs encrypted anyway.

> [!NOTE]
>
> Inform external providers about the switch if their services are integrated into your pages, for example a rating provider.

Guide: JavaScript and jQuery

Basics: Text maintenance platform

### Testing

> [!NOTE]
>
> The SSL test mode is activated by WEBSALE technical staff. Please contact your representative for this.

Call the shop with three parameters:

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
https://www.ihre-domain.de/?test=on&design-test=on&sslonly-test=on
```

Then click on any category and any product. The address now starts with `https://`. Open your browser's developer console and go through the shop.

> [!WARNING]
>
> Before switching to SSL-Only, the console must not report errors on any page of your shop. Messages about blocked unencrypted content point exactly to the places that are still open.

### Switching

Once all calls have been switched and the console remains error-free, remove the `ST-DesignTest` brackets you used to test individual places. Then contact WEBSALE; the switch itself is carried out by WEBSALE technical staff.

> [!NOTE]
>
> All shops and subshops under the same domain are switched at the same time.

Guide: Switching the shop's test modes on and off

Reference: ST-DesignTest

## Related topics

* Guide: CSS
* Guide: JavaScript and jQuery
* Basics: Text maintenance platform


## Related topics

- [$wsTestMode - Test mode](https://dokumentation.websale.de/en/frontend/referenz/module/wstestmode.md)
- [EJD- (JSON interface)](https://dokumentation.websale.de/en/v8s/referenz/tags/ejd.md)
- [JSON interface](https://dokumentation.websale.de/en/v8s/externe-dienste/json-schnittstelle.md)
- [Basics & architecture of Strapi](https://dokumentation.websale.de/en/strapi-cms/grundlagen-architektur-von-strapi.md)
- [Server configuration ws_access.conf](https://dokumentation.websale.de/en/v8s/referenz/konfigurationen/server-konfiguration-ws-access-conf.md)


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.