Introducing the Next-Gen Blazor PDF Viewer Component

Jollen Moyani - Jul 10 '23 - - Dev Community

In our 2023 Volume 2 release, we have introduced a next-gen Blazor PDF Viewer component that allows users to view, edit, print, and download PDF files without the web service dependency in Blazor applications. It is designed to be fast and responsive and supports all the features of the previous PDF Viewer.

In this blog, we will discuss the improvements that distinguish the next-gen Blazor PDF Viewer component from its predecessor, PDF Viewer.

Next-Gen Blazor PDF Viewer Component

Next-Gen Blazor PDF Viewer Component

Advantages of the next-gen Blazor PDF Viewer

Let’s briefly discuss the advantages of the next-gen Blazor PDF Viewer over the previous one:

  • Enhanced performance and memory : The next-gen PDF Viewer uses the WebAssembly version of PDFium, reduces JS interop calls, and performs better. Also, it consumes less memory for both server and WebAssembly apps.
  • Unified package for multiple platforms : A unified NuGet package supports various operating systems, including Windows, Linux, and MacOS, eliminating the need for separate packages.
  • No more web service dependency in Blazor WebAssembly : Web service dependency is no longer required in Blazor WebAssembly apps. This means you can deploy the new PDF Viewer to any platform that supports Blazor without worrying about setting and maintaining a web service.
  • ARM64 support : This new Blazor PDF Viewer can also be deployed to ARM64 machines.

Performance improvements

In the previous PDF Viewer component, we used Pdfium.dll to acquire PDF document pages as images. The next-gen PDF Viewer component uses the WebAssembly version of PDFium. This change allows the new PDF Viewer to directly retrieve PDF images, text, and hyperlinks on the client side.

By adopting this approach, we have significantly reduced the need for JavaScript interop calls and alleviated the burden on the server. Thus we have observed notable enhancements in the performance of rendering, scrolling, zooming, panning, and printing operations.

To assess the improvements, we compared the speed of various operations between the old PDF Viewer and both server and WebAssembly instances of the next-gen PDF Viewer.

Action

Speed improvements in the next-gen Blazor PDF Viewer

 

Server

WebAssembly

Initial loading

~+ 104%

~+ 413%

Page navigation

~+ 92%

~+ 19%

Zooming

~+ 170%

~+ 277%

Panning and scrolling

~+ 146%

~+ 217%

Printing

~+ 142%

~+ 706%

Here is the PDF document we used to measure the performance improvements.

We are focusing on further enhancing the performance of our next-gen PDF Viewer in upcoming releases.

Reduced JS interop calls

The previous PDF Viewer heavily relied on multiple JS interop calls to obtain essential document information, such as page text, hyperlinks, and images. Unfortunately, this approach often led to longer processing times and significant performance overhead.

In the next-gen PDF Viewer, we have entirely redesigned these functionalities to be executed on the client side. By leveraging client-side processing, we have achieved major performance improvements. This approach reduces server-side interactions and enables faster retrieval of document information.

The transition to client-side processing has delivered several benefits. One of the most important benefits is minimized JS interop calls to retrieve document information. Additional benefits include reduced server dependencies and improved UI responsiveness.

Reduced memory consumption

As mentioned previously, the old PDF Viewer component used Pdfium.dll, which runs on the server, for managing images, hyperlinks, and text while viewing a PDF file. This approach put a heavy load on the server and consumed significant memory.

Since the next-gen PDF Viewer component uses the WebAssembly version of PDFium that runs on the client side, the server load is reduced remarkably. In fact, we have observed an impressive 57% reduction in memory consumption. This significant improvement in performance and memory delivers a smoother and more efficient experience for end users.

Unified package for multiple platforms

In the previous PDF Viewer component, we maintained separate packages for each operating system, namely Windows, Linux, and MacOS. This required including specific PDFium dependencies in the published folder, which caused confusion and complications for developers during the hosting process in multiple environments.

Wielding the WebAssembly version of PDFium, the next-gen PDF Viewer component does not require separate packages for each operating system. The single common package is compatible with all environments. The former hosting complexities are resolved, making the hosting process smoother and more consistent, regardless of the operating system used.

ARM64 support

WebAssembly PDFium also means that the next-gen PDF Viewer can be deployed to ARM64 machines. This means developers can create Blazor apps capable of viewing PDF files on all Blazor-supported devices.

Migrate to the next-gen Blazor PDF Viewer

If you use the previous PDF Viewer, we recommend migrating to the next-gen Blazor PDF Viewer component.

References

For more details, refer to the new Blazor PDF Viewer component user guide, web demos, and GitHub repository.

Conclusion

Thanks for reading! In this blog, we had a quick overview of the enhanced performance, streamlined development, and improved deployment of the next-gen Blazor PDF Viewer component in the 2023 Volume 2 release. Keep an eye out for our upcoming updates and tutorials, where we will guide you on harnessing the capabilities of this innovative component in your apps.

The new Blazor PDF Viewer is a powerful and versatile tool for viewing, annotating, and printing PDF documents. It has all the features of the previous PDF Viewer and is easy to migrate to.

You can also check out all the other updates in the 2023 Volume 2 release on our Release Notes and the What’s New pages.

Try out these features and share your feedback in the comment section below. You can also reach us through our support forums, support portal, or feedback portal. We are always happy to assist you!

Related blogs

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .