JS scripts
Optimization
Minification
We continue to announce new features of the new version of Stimulsoft 2022.1, which will be available very soon. Today we will tell you about new data sources for the Stimulsoft Reports.Blazor product.
You used to be able to use only file sources: Excel, XML, JSON, CSV, DBase, when connecting data in the report designer. This introduced significant restrictions in the process of developing reports.
In the new version of Reports.Blazor product (included in the subscription product Reports.Web), you will be able to connect all available types of data for Server components:
In the new version of Reports.Blazor product (included in the subscription product Reports.Web), you will be able to connect all available types of data for Server components:
- SQL (MS SQL, MySQL, Oracle etc.);
- NoSQL (MongoDB);
- Azure (Blob and Table Storage, Azure SQL, Cosmos DB);
- Google (Firebird, Google Analytics, BigQuery, Google Sheet);
- online services (data.world, QuickBooks);
- REST (OData).
To use these data sources you should add an adapter to your project, a list of supported version is on our website. The ability to connect various types of data sources substantially expends the functionality both of our report generator and your applications, which were written for Blazor.
In today's note, we will tell you about an important improvement of our products, which will be available, starting from version 2022.1. We are talking about a significant reduction of code size due to the JS scripts optimization.
The Optimization includes both packaged and regular files. First of all, let's deal with pack files: we've changed the archiver's algorithm from Deflate to Brotli here. The total amount of code reduction was about 20 percent.
In regular files where using a packer is impractical, the code was rewritten to reduce. We also optimized the minification procedure: in fact, we developed our methods for the minifier, which functions before using the UglifyJS compression tool. As a result, this tool receives an already minified code, which increases the efficiency of compression.
In regular files where using a packer is impractical, the code was rewritten to reduce. We also optimized the minification procedure: in fact, we developed our methods for the minifier, which functions before using the UglifyJS compression tool. As a result, this tool receives an already minified code, which increases the efficiency of compression.
Code optimization results in a more rapid loading without increasing the time of running both in minified and pack-scripts versions. The code optimization affected Stimulsoft products, which use JavaScript – Reports.JS, Dashboards.JS, Reports.PHP, and Dashboards.PHP.
More than a month remains until the most magical holiday of the year, Christmas, comes. But you do not have to wait so long for gifts. We have prepared something special for you. We will soon release a new version of the products for creating reports and dashboards Stimulsoft - 2022.1. Here are a few significant updates and new features that you may expect shortly.
3D Pie chart
In the new version, we will allow you to add a new long-expected option to your reports and dashboards - a 3D Pie Chart. A pie chart is familiar to everyone; it is a circle divided into sectors to display statistical populations. Now the designer will have a three-dimensional version of it, which will expand the visualization of data series and simplify their understanding.
Optimizing minification of JS scripts
In the new version of the products Reports.JS, Dashboards.JS, Reports.PHP, and Dashboards.PHP, large-scale code optimization and the JS scripts minification procedure have been carried out. As a result, the overall size of the code has been significantly reduced. This will lead to faster loading of components.JS scripts
Data sources in Blazor
Starting from version 2022.1, in Reports.Blazor (the Blazor.Server component, which is part of Reports.Web), the ability to connect data not only from file data sources will be added. By loading and connecting adapters it will be possible to work with almost any type of data - SQL (MS SQL, MySQL, Oracle, etc.), Azure (Blob and Table Storage, Azure SQL, Cosmos DB), Google (Firebird, Google Analytics, BigQuery) and many others.Watermark, rounding, transparency on the dashboard
The new functionality will be added to dashboards. One of them is a watermark, which can be used as text, images, weaves, or any combination. Also, for dashboard widgets, it will be possible to define rounding of borders, background transparency, and shadows of components.
New Barcodes
In the new version you will be able to use new types of barcodes – Aztec and Intelligent Mail USPS 4-State, when creating reports and dashboards. The Aztec is a popular barcode, which was created in the late 1990`s and used among other things, for automatic data recognition. The Intelligent Mail USPS 4-State was developed by the United States Postal Service (USPS) and is used for automatic sorting of letters.These and other changes will be live very soon in version 2022.1 of Stimulsoft Reports and Dashboards.
On November 8, 2021, Microsoft company officially announced the .NET 6 release. This is a popular platform for software development.
Unfortunately, this led to some difficulties in the work of software products. The thing is that Microsoft company decided that the System.Drawing.Common library is compatible only with Windows. This was done due to the inability to fix errors in third-party operating systems - macOS and Linux.
The problem of incompatibility of the System.Drawing.Common library affected users of Stimulsoft products, too. As a temporary solution for the project using the .NET 6.0, we offer you to install the previous version 5.0.3 of the System.Drawing.Common library, which is backward compatible with the .NET 6.0 and, as before, it supports Linux and macOS systems.
Right now, we at Stimulsoft are revising our products, the main task of which is to avoid dependence on the System.Drawing.Common library and, thus, to make the Stimulsoft report and dashboard engines completely cross-platform.
Unfortunately, this led to some difficulties in the work of software products. The thing is that Microsoft company decided that the System.Drawing.Common library is compatible only with Windows. This was done due to the inability to fix errors in third-party operating systems - macOS and Linux.
The problem of incompatibility of the System.Drawing.Common library affected users of Stimulsoft products, too. As a temporary solution for the project using the .NET 6.0, we offer you to install the previous version 5.0.3 of the System.Drawing.Common library, which is backward compatible with the .NET 6.0 and, as before, it supports Linux and macOS systems.
Right now, we at Stimulsoft are revising our products, the main task of which is to avoid dependence on the System.Drawing.Common library and, thus, to make the Stimulsoft report and dashboard engines completely cross-platform.
In the new article, we are telling you about a topside innovation of the Stimulsoft Reports and Dashboards 2021.4 – implementing the Blockly tool for creating event scripts in a report. Principles of work and integration of the tool, basic capabilities, and examples for your understanding.
A bit of history
In 2012 Google released a new visual programming language which was called Blockly. The tool is applied to create programs and scripts without typing some text or symbols. In other words, development is not carried out with the help of manual coding but by using connecting logical blocks. In Blockly, you can connect ready-made blocks in such a way to get a full-fledged script where you can make various changes and edits. Visually, the process looks like a puzzle collection. Take a look how it looks like:
Blockly is technically implemented in JavaScript and freely distributed with a source code under the Apache 2.0 license.
Blockly in Stimulsoft products
Now, let's figure out how this tool is used in the report designer. After Blockly was implemented in the 2021.4 version, our product could make changes, creating scripts without writing a code.Previously, an event script from a code was created in the platform programming language. For example, for the .NET Framework, it is C# (VB.Net), and for JS components, it is JavaScript. Therefore, a report with event scripts written in C # did not work in the JS report generator. Blockly tool allows you to create universal scripts of events in a report. Thus, a report with Blockly scripts will work on all platforms.As an example, let's take a report and add an event script to it. See the image below how it looks in the designer:
Let's create a script of component style replacement when report designing. After that, change the component style when exporting the report. Go to the Properties panel, open the Events tab. Since we will change style when report designing, the script should be created in the Begin Render event.
To call the event editor, you should click the Browse button of the Begin Render event.Note! The event editor mode can be changed in the Options window, which you may find in the File menu.After, the Blockly editor will be opened, where an event script is created:
According to this script, a new style will be defined for each text component, which is Header. To do that, you should use the Component Style property, component name, which style should be changed, and style name - «Header3Blue». Also, you should redefine the style of even rows of the Data band.
Go to the Preview tab to check the result of these changes.
The color of data header components was changed, and the color of even rows in the data list was changed, too.
Now, let's change the style of headers when exporting a report. To do that, you should go to the Properties panel again and open the Events tab (don`t forget to select the report template area). To execute any script before converting the report to a document, you should use the Exporting event.
Note! When rendering, the necessary number of component copies is created. In our sample, three copies from the text component with the TextAddress name will be created when processing.To replace the style of all component copies in a rendered report, you should use loops and local variables. Let's refer to the copies of components in a rendered report by component names. Then let's define the "Header3Red" style for all these copies.
After you create a script, you should go to the Preview tab and export your report, for example, to a PDF document.
At the beginning of the export process, a new style will be assigned to the data headers. Here's a live example to see how changing the style of components works when exporting a report. Follow the link and export, for instance, to PDF.
We hope that this article was helpful for you, and now you will be able to use the Blockly tool when working with reports. To better understand the functioning of this tool in our products, we prepared a playlist where you will find various examples of using Blockly. We will constantly replenish the collection of videos. Subscribe to our channel not to miss any video.
If you have any questions, contact us – we will be glad to assist you.