WebForms Core version 2 will be released in about a month. WebForms Core is an ambitious and radical web technology created by Mohammad Rabiei in 2024. The technology has been continuously improving for about 1.5 years since its initial release. WebForms Core 2 is one of the biggest updates in the world. An update with more than 50 amazing features that is bigger than the iOS 18, Windows 10, Windows XP, and Android 12 updates combined.

In this article, we want to introduce you to two new features in WebForms Core that we will have access to in version 2 before the release. Before we write about these two technologies, we want to introduce you to the structure of WebForms Core.

Unlike current web architectures, in which state is updated in a request-response cycle, WebForms Core is based on a revolutionary architecture called “Server-Commands/Client-Execution”. The “Server-Commands/Client-Execution” structure could be a turning point in the evolution of web architecture in the 2020s. WebForms Core is an innovative and transformative concept and the basis for a change in the way we think about development. The idea of ​​“Server-Commands/Client-Execution“ is a fundamentally new and highly efficient solution to a wide range of modern web development problems. By using this technology, the developer focuses only on business logic and leaves the functionality and complexity of the UI to the command-and-execute protocol. WebForms Core is not a new or different Blazor Server! It is a huge paradigm shift that organizes the benefits of front-end frameworks with commands on the server.

Gzip from the client

In version 2 onwards, we will have the ability to send data as Gzip, as well as the ability to initial Gzip upload files. In keeping with Elanat’s tradition of simple development and minimalist maintenance (still suitable for the largest web projects), these two features are fully automated and you just need to enable them in the WebFormsJS settings.

Note: Simple development and minimalist maintenance is not meant to be for small to medium systems, but rather a return to simplicity where developers can think in terms of business logic and high-level UI actions rather than managing DOM updates or component lifecycles. This can make large web applications easier to maintain.

var WebFormsOptions = new Object();
WebFormsOptions.UseProgressBar = true;
WebFormsOptions.UseConnectionErrorMessage = true;
...
+WebFormsOptions.UseGzipFileSend = false;
+WebFormsOptions.UseGzipFileSendIgnoreList = ["zip", "gzip", "rar"];
+WebFormsOptions.UseGzipDataSend = false;
+WebFormsOptions.UseGzipDataSendLargerThan = 5 * 1024;

UseGzipFileSend = false

This option determines whether files sent from the server to the client should be compressed using Gzip.

A value of false means that file compression is disabled when sending.

UseGzipFileSendIgnoreList = ["zip", "gzip", "rar"]

This list specifies which file types should not be compressed even if compression is enabled.

Files with the extensions zip, gzip, rar do not need to be compressed again, as they are already compressed.

UseGzipDataSend = false

This option is related to compressing data (not files) when sending.

A value of false means that data is sent without compression.

UseGzipDataSendLargerThan = 5 * 1024

This option determines whether compression should be performed if the data size is greater than 5 KB.

Of course, since UseGzipDataSend = false, this condition has no effect for now unless data compression is enabled.

Depending on the back-end you use, you will also need to have appropriate middleware on the server side to decompress data. In the Elanat ecosystem, you can use the CodeBehind framework version 4.4 and use two new middlewares “UseGzipDecompression” and “UseGzipFileDecompression” to decompress data and files.

var builder = WebApplication.CreateBuilder(args);

var app = builder.Build();

SetCodeBehind.CodeBehindCompiler.Initialization();

// Decompress the entire body if it is gzip.
+app.UseGzipDecompression();

// Decompress gzip files inside the form and check for unauthorized files
+var allowedFiles = new[] { ".jpg", ".png", ".pdf", ".txt" };
+app.UseGzipFileDecompression(allowedFiles);

app.UseCodeBehind();

app.Run();

Decompress the request body (Body)

app.UseGzipDecompression();

If the request body (Body) is Gzip compressed, this middleware will decompress it. This is done before the data is processed by other middleware.

Decompress form files and check if they are allowed

var allowedFiles = new[] { ".jpg", ".png", ".pdf", ".txt" };
app.UseGzipFileDecompression(allowedFiles);

Files submitted in the form and compressed with Gzip are decompressed. Then it is checked if the file extension is in the allowedFiles list. This is done to prevent dangerous or unauthorized files from being uploaded.

Optimize Web File Uploads with Client-Side Gzip

Sending files from the browser to the server is one of the most common operations on the web, but when the file size is large, the transfer speed decreases and the user experience suffers. Using client-side Gzip compression can effectively solve this problem.

How does it work?

Using this new feature in WebForms Core, files can be Gzipped before being sent to the server. In practice, the workflow is as follows:

1- The user selects the file.

2- Before sending, the file is Gzipped.

3- The browser sends the compressed file to the server with the X-Files-Gzip: true header.

4- On the server side, the middleware for Gzipped files decompresses the file and delivers it to the pipeline.

Benefits of using Gzip on the client side in WebForms Core:

1. Reduce data transfer volume
2. Reduce user waiting time
3. Avoid double compression
4. Synchronize with the server by specifying the X-Files-Gzip request header
5. Better user experience

Summary

Using Gzip on the client side is a simple, yet powerful way to optimize file transfers. Combined with the right middleware on the server, you can:

• Increase transfer speed
• Reduce bandwidth consumption
• Ensure secure and reliable file processing

As a result, this method provides significant improvements in web application performance and user experience, especially on systems that send large files or a large number of files.

Optimize Non-File Data Transmission on the Web with Gzip

In many web applications, in addition to files, a significant amount of text data (such as forms, JSON, XML, or API payloads) is transferred between the client and the server. Using Gzip to compress this data on the client side can significantly increase system performance.

How does it work?

WebForms Core technology compresses text data before transmission by calling modern browser APIs:

1- The data (for example, JSON strings or form data) is converted into an ArrayBuffer. 2- The collected data is Gzipped. 3- The browser sends the compressed data to the server, and a “Content-Encoding: gzip” header is added to identify the compressed format. 4- On the server side, the middleware checks that the data is Gzipped and decompresses it so that the pipeline can process it naturally.

Benefits of using Gzip for non-file data

1. Reduce payload size
2. Increase application speed
3. Reduce server and client resource consumption
4. Compliant with the HTTP standard
5. Improve user experience

Summary

Using Gzip for non-file data is a simple and very effective way to:

• Reduce payload size
• Increase response and upload speed
• Optimize network and resource consumption

This method is especially useful for submitting large forms, complex JSONs, and large APIs, and can significantly improve the user experience.

Implementation Tips

• Data compression is only necessary when the size is above a certain threshold (e.g. more than a few kilobytes).
• Server middleware should check that the data is Gzipped and decompress it before processing.
• Data that is already compressed or binary (e.g. files or images in Base64) should not be Gzipped again, as this may increase the size.
• Other data will not be Gzipped when you try to upload a file.