Infragistics Ultimate: H2 2021 Roadmap

Jason Beres [Infragistics] / Wednesday, May 5, 2021

With the release of Ultimate 21.1 right around the corner, I wanted to post an update on our goals for the remainder of the year so you can plan the next 12 months of your own projects.

Here is a breakdown of this blog:

Our thinking remains the same as we build out controls & components on the platforms that we are delivering to you. We think about them in terms of broader product categories and how they work in the tooling that you use to build software with what we ship.

There is so much innovation happening in client UI development. Besides the modern web frameworks like Angular and React, you now should consider using Web Components as a dependency-free way to future-proof your projects. Microsoft is re-engaging the developer market in a big way with Blazor, Win UI and all the good things happening with Fluent UI.  There are alternatives like Uno Framework, which delivers a complete cross-platform framework, in some ways more advanced that Xamarin and future M.A.U.I from Microsoft targeting native mobile, cross-platform multi-application user interfaces.

This visual breaks down how we see this categorization and our areas of investment.

Focus areas in the Angular and Blazor roadmap for 2021

We are hitting the mainstay frameworks in Ultimate like Window Forms, WPF, .NET Core as well as the modern web frameworks in Blazor, Angular, React and Web Components. Innovation is happening fast in Indigo.Design, with the new App Builder that can radically accelerate your app design and development.

2021 at a Glance

There is a lot of detail in this blog, if you are in a rush, and just want to see the high-level, this visual describes what you can expect in 2021 in your Ultimate subscription.

High level Angular and Blazor roadmap

We have a lot of software shipping across many frameworks. It’s important to note that we are still pushing releases in Windows Forms and WPF. While it has slowed down a bit, there are still updates and  new features happening.  I get a lot of questions about our investment here, and it is important to stay updated with the latest versions for these reasons:

  • New Features / Updated Features
  • Bug Fixes / Security Updates
  • Staying Current with Latest .NET Framework
  • Staying Current with the Latest Visual Studio

Microsoft is aggressive on .NET updates and Visual Studio updates.  As you know with .NET Core release in 2020, they changed the entire design-time in Visual Studio which broke all 3rd party controls. If your subscription isn’t current, you won’t get those updates.

Here is a timeline view of releases.  Keep in mind that for the most part, we are releasing monthly across many products, with bug fixes and small updates. Keep an eye on both NPM and NuGet for the latest builds.

Angular, Blazor and React roadmap timeline

Note:

  • Releases marked as Web include all Ignite UI platforms for React, Web Components, Blazor.
  • Ultimate product release includes all Web platforms, WPF, Windows Forms & Indigo.Design.

Web Platform Strategy

To understand the roadmap and how features are related, let me explain how these platforms are designed and engineered by our teams.

The overall strategy for delivering Web products is to ensure best-of-breed on your desired platform. If you are building on Angular, we are bringing the best Angular product to market for the Angular framework. Same with React, Web Components and Blazor. For example, we are not creating wrappers to give you the facade over generic JavaScript controls with jQuery helpers buried deep in the code to make you think you are using Angular. We build Angular Material components, and we work with the Angular team on Material UI and the CLI. We do it right the first time. Blazor is another great story, the approach we take which I describe below is vetted by the Blazor team at Microsoft as the most optimal approach. We will not try to wow you with reasons why *we* think our approach is best – we just asked the folks that built the framework, and they gave the thumbs up!

To give you an idea of what the codebase / API breakdown is by product in Ignite UI, check out this graphic:

API by Platform- Angular, React and Blazor

The Web Components, React, and Blazor products all start from C#, and we translate the code to TypeScript. This gives us a pure, dependency-free Web Component API, which we use as the basis for what is ultimately rendered as HTML / JavaScript in the browser.

This delivers the most optimal Blazor experience, in terms of developer productivity and render / interactions performance in the browser. To prove it … just look at our Blazor grid demos – we don’t do “paging” samples like everyone else – in fact – we didn’t even build paging into the grid.  We don’t need to.  The performance of our grid, and with local and remote load-on- demand, far exceeds anything you’ll find on the market today.  If you want a page, we have a sample with one in it, but you need to write a few lines of code to get it.

jQuery is the foundation for the ASP.NET Core and ASP.NET MVC products.  It is still widely used, and we are still investing in these products to ensure they are modern and up to date.

Ignite UI for Angular is built on Angular & Material. There is nothing between our API and the Angular framework. We have seen the biggest uptake on Angular to date in enterprise teams, and we continue to invest significantly in Angular components. 

However, moving forward, any new  controls that we ship on every modern web platform will be built as dependency-free Web Components (like the new DockManager that we shipped in Angular 9.1). This is really important and can’t be understated – this gives you a future proof UI control toolkit  as well as super-optimized performance on the client.  This does not mean new controls won’t work as a native Angular, React, Web Component, Blazor, etc , it means that each product will be based on a web-standards foundation, insulating you from framework issues in the future.

2021 H2 In-Depth

The rest of this blog will give a bit more detail on what we will be shipping so you can plan and give us feedback on the roadmap. Everything we deliver is based on what you ask for, so please let me know if there is something you expected but do not see.

Future of the Web is Web Components

We’ve shipped a lot of value in the last 12 months since the official release of Blazor and prior to that React and Web Components.  Moving forward, we have a strategy that starts to expand out the number of UI controls we are shipping with these products. Sticking with a strategy that promotes re-use and future proofs you from being siloed into a framework, we are starting to refactor a large portion of the current Angular controls and components to native Web Components.  Web Components are a web standard, they work in every browser, and they don’t depend on a 3rd party framework – they are dependency-free.  Web Components just need a browser to function properly.

With this strategy, you’ll get the same number and types of controls in all modern web platforms that are currently in Ignite UI for Angular today – and moving forward – everything will be in sync across all frameworks.

We’ll ensure that each Web Component includes bindings for every framework, and is optimized for high-volume, high-performance scenarios.

Web Components to Angular

Important to note:

  • We are not refactoring the Ignite UI for Angular Grid, Hierarchical Grid or Tree Grid. A Data Grid is a unique control that does benefit on the per-platform / framework capabilities.
  • We already ship a ton of Web Components across our modern web SPA products. Dock Manager, all of the Charts (Category, Data Chart, Pie Chart, Tree Map, plus 60 more chart types), Geospatial Map, Financial Chart, Excel Spreadsheet and Excel Library that you see in Ignite UI for Angular are Web Components.

Your Productivity is our Priority

I was going to say “All Roads Go Through Indigo.Design” but I want to highlight that our priority is your productivity. UI controls and components are foundational to your app building needs.  However, you are being asked to deliver more features and more applications faster than ever before.

With our strategy to deliver the same UI controls on every framework and enable our new App Builder in Indigo.Design to generate code in any platform, our goal is to give you productivity like you’ve never experienced. You can use the WYSIWYG designer in App Builder to quickly create all the screens and interactions of your app, bind to live data and apply a built-in theme or create a custom one and then get a live preview of your app and then download the Angular code.

Angular, React and Blazor code generation

Today, we are creating Angular apps in App Builder.  Once our move to Web Components is complete this year, you’ll get React, Web Components and Blazor code generation from the App Builder. 

If you don’t know what App Builder is and how it can help you, check out the product page and watch this overview video.  It is the low-code tool that can accelerate app delivery in your organization.

Indigo.Design Web App Builder IDE

Ignite UI for React / Blazor / Web Components Updates

As you learned in our overall web strategy, the React and Web Components product are the same codebase. If you read the blogs on the 20.1 React and Web Components release, it was a Grid-heavy release. We are continuing that theme for the rest of the year. We need to bring the Grid up to the same feature set as the Angular Data Grid, which has been in the market much longer. 

Next release - May 19th - we’ll be shipping in React, Web Components and Blazor:

Data Grid Updates:

  • Excel Style Editing - Begin Editing when Typing
  • Excel Style Navigation (Enter Behavior) – control the behavior of the enter key (none, edit, move up/down/left/right)
  • Excel Style Navigation (After Edit) - When cell editing, enter moves to the cell below, above, right, left
  • Row Range Selection (will need additional implementation for virtual data – so this should be noted in the docs)
  • Column Summaries in Column Options

Date Picker Updates:

  • Added Today button
  • Added Label property
  • Added placeholder property
  • Input date string (can be enabled / disabled)
  • Support date formats
  • First day of week
  • First week of the year
  • Week numbers
  • Date limits
  • Accessibility

Geospatial Map Updates:

  • Support for wrap around display of the map (scroll infinitely horizontally)
  • Support for shifting display of some map series while wrapping around the coordinate origin.
  • Support for highlighting of the shape series.
  • Support for some annotation layers for the shape series

Chart Updates:

  • Orientation on ItemLegend
  • LegendHighlightingMode for Hover / Click
  • PlotAreaMargin<Top, Bottom, Left, Right>
  • Added support to configure highlighting at the level of the chart rather than the individual series.
  • Compressed X-Axis labelling for the TimeXAxis and OrdinalTimeXAxis
  • Automatically sync the vertical zoom to the series content.
  • Added support for Annotation Layers to Stacked, Scatter, Polar, Radial and Shape series.
  • Added support for highlighting to Stacked, Scatter, Polar, Radial and Shape series.
  • Added HighlightingMode for all series types.
  • Added SeriesHighlightingBehavior
  • Added support for overriding the data source of individual stack fragments within a stacked series.
  • Added support to automatically expanding the horizontal margins of the chart based on the initial labels displayed.
  • Added support for the custom style events to Stacked, Scatter, Range, Polar, Radial, and Shape series.
  • All series with markers have a property called MarkerFillOpacity
  • All series with markers have a property called MarkerOutlineMode

Chart Defaults:

  • All types of charts/series have new colors for brush/fill and outlines
  • All types of charts/series have marker outlines with 2px thickness
  • All types of charts/series with markers have colored marker fill instead of white fill
  • Bar/Column/Waterfall series have outlines with 1px thickness (other series have 2px thickness)
  • Bar/Column/Waterfall series have square corners instead of rounded corners anymore
  • Point/Bubble/ScatterSeries/PolarScatter series have markers with 70% transparent fill
  • Point/Bubble/ScatterSeries/PolarScatter series have markers with solid outline that matches marker fill
  • Other series (e.g. LineSeries/ScatterLineSeries) have markers with white outlines
  • Scatter High Density series has new colors for min/max heat properties
  • Financial/Waterfall series have new colors for negative fill of their visuals

Moving forward to Q3 and Q4 is where you’ll start seeing more brand-new controls in the toolbox.  If you’ve been paying attention to the Angular product, you know we’ve heavily invested there for the last few years.  The product is amazing, has every control you’d ever need, plus key capabilities like theming, ARIA / A11y accessibility, RWD support, PWA support, Angular Schematics, Data Analysis, CLI, and the list goes on.  It’s the only choice for Angular today if you are building anything from a simple web app to a business-critical app. This means there is a lot of work we can reuse in our refactoring effort.

Here is a list of those controls that will be part of the refactoring to Web Components (you can see any of them in action here in the Angular samples browser) - https://ko.infragistics.com/products/ignite-ui-angular/angular/components/grid/grid.

Angular to Web Components


Once these are refactored as Web Components, you’ll get them in React, Blazor and the Indigo.Design App Builder. 

Moving to Q3 / Q4 for React Grid, Web Component Grid and Blazor Grid features, we’ll be adding:

  • Layout Persistence
  • Multi-Column Headers
  • Collapsible Column Groups
  • Interactive Grouping
  • … and more

Hopefully you can see with all of these updates and new controls and components that React, Web Components and Blazor are moving forward in a big way.

Ignite UI for Angular Updates

Angular is still under heavy development. We have consistently shipped multiple major updates each year for the past 4 years, in a monthly continuous delivery cadence.

 In the short term in the April / May here is a high-level list, you can see the details on GitHub in the roadmap.md and the changelog.md.

  • Angular 12 updates
  • All of the Chart updates listed for React / Web Components / Blazor
  • All of the Map updates listed for React / Web Components / Blazor
  • New Tree component
  • Themes: Expose elevations as custom CSS props
  • Themes: Scope custom CSS props to component selectors
  • Expose a column input for passing additional data/state in the template contexts of the column
  • Angular Grid Export Hierarchical Data to Excel
  • Angular Grid Column Types for Datetime and Time

 Going down the road to Q3 / Q4:

  • Angular 13 updates
  • PDF Export for Grid, Tree, Hierarchical Grid
  • Graph / Network Node component
  • Accordion component
  • Scheduler component
  • Grid Cell Merging
  • Global palette values for components

This product is 100% open in the development process, so you can track where we are at with requests and issues on Github.

ASP.NET / jQuery Updates

With the Microsoft ASP.NET MVC and ASP.NET .NET Core / .NET 6 releases we will continue to ensure you have the most up to date products in these frameworks. As I explained earlier in the blog around how we build the web products, Ignite UI for jQuery is the underlying control set that drives the ASP.NET MVC and ASP.NET Core products. We first shipped Ignite UI for jQuery in 2011 … it is a complete set of controls, so for modern ASP.NET MVC / ASP.NET Core apps, the component set is huge. Everything from Data Grid, Tree Grid, OLAP Pivot Grid, Spreadsheets, Charts, etc. is in that product.

The roadmap for this set of products is still active, and tracks with our Web Components strategy for modern web.

  • All of the Chart updates listed for React / Web Components / Blazor
  • All of the Map updates listed for React / Web Components / Blazor
  • All Web Component controls that ship with Ignite UI for Web Components also ship with jQuery (the controls that do not overlap, so for example, Dock Manager ships with jQuery).

At the same time, we are actively bug fixing and ensuring this set of platforms is up to date.  When you see a blog or a mention of a Web Component feature, it will ship with the jQuery product if we don't already have it in the product.  And if, for example, you see yourself using other Web Component controls in the future, just make sure your subscription is for the Ignite UI bundle, and you'll get all modern web controls no matter what we end up shipping.

.NET Core / .NET 6 Updates

Microsoft continues to innovate with .NET, and we are right there with them. We shipped support for both .NET Core 3.0 and .NET Core 3.1, and for .NET 5 with Microsoft, and now we are on the same journey to .NET 6.

What to expect:

  • Updated desktop builds for .NET 6.
  • All of the improvements that Microsoft is shipping with Blazor, Xamarin / M.A.U.I will be part of the .NET builds of our products.
  • Design time support for WPF, Windows Forms for any changes Microsoft makes to Visual Studio with .NET 6.
  • Updates to our Win UI preview to include full support for Grid and Chart
  • New Win UI controls that are not included in the current Win UI Preview we are shipping.

Along with tracking with Microsoft’s strategy for cross-platform development, we are investing in the Uno Platform.  We shipped a preview of Ultimate UI for Uno in Q4 2020.  With Uno, you can create pixel-perfect, multi-platform applications with a single-codebase, including applications for Windows, WebAssembly, iOS, macOS, Android and Linux using C# & XAML.

Windows Forms / WPF Updates

Windows Forms and WPF are still the most popular platforms for building apps in the world.  We are continuing to invest in both platforms, so you can expect to see updates for years to come.  Many of you who are using these platforms are doing maintenance and building new features or apps, as well as experimenting with new platforms like Win UI, Xamarin, or even Angular.  No matter if you are staying on your current platforms or trying out new one, we are here to support you.

This year, we will be delivering:

  • Updated desktop builds for .NET 6.
  • Improved design time support in Visual Studio for Windows Forms and WPF.
  • Improved HD / High DPI support.
  • All of the Chart updates listed for React / Web Components / Blazor.
  • All of the Map updates listed for React / Web Components / Blazor.

Indigo.Design / App Builder

The biggest challenge in app development today is streamlining app creation from design to code. In countless teams, from small to large, a siloed approach to app creation slows down innovation. The need to eliminate hand offs, reduce costly iterations and enable true Design-Development collaboration is the holy grail we are all after. That’s why we shipped App Builder.

I outlined a more detailed roadmap here … but for convenience you can get a high-level of what we are planning with this timeline:

 Web App Builder Roadmap

If you are not familiar with App Builder, check out the YouTube playlist, it will forever change the way you look at building web apps!

Wrap Up

2021 will bring a ton of platforms, new features, new controls, new components, more bug fixes, and lots of excitement. Keep in mind this is a roadmap, with pretty aggressive dates.  Things may be delayed, slip, ship as a beta, etc. as with any best laid plans, things can change. Please keep me posted at jasonb@infragistics.com on what you need, and how we can help bring your next amazing experiences to life!