Use DOTVVM for ASP.Net web forms to .Net core 8 migration with Custom component Library

🌎 Discussion in English
1

Hi,

I am exploring the feasibility of migrating Asp.net 4.8 Web Forms to .Net core 8.0.

I have applications design with custom components and User controls with JS.

I am trying to explore below options:
a.DOTVVM
b.Blazor
c. MVC Rajor views with Custom components

Below are considerations:

  1. Tight performance SLA
  2. Minimal effort and cost
  3. Minimal Learning curve

Questions I have
a. I feel I need to rewrite UI with fresh DOTVVM controls as I am not using standard controls.
b. Getting feeling that creating same look and feel will be good effort but still 1000 % will not achievable
c. MVVM need to be introduced.
d. I am having other application using MVC razor views so different learning curve as well

Sample converted code:
<dot:Content ID=“Content1” ContentPlaceHolderID=“head”>
</dot:Content>
<dot:Content ID=“Content2” ContentPlaceHolderID=“Title”>
<cd:JsInclude ID=“JsIncludeActivateArchive” DependencyId=“ActivateArchive” FilePath=“ActivateArchive.js” Priority=“999” PathNameAlias=“Admin” />
<asp:HiddenField ID=“hdDelay” ClientIDMode=“Static”/>

<COM:Label ID=“lblArchiveTitle” Text=“<%$ WebsiteResources : MULBL001407 %>”></COM:Label>



 
<COM:Label ID=“lblScheduleArchive” CssClass=“text” Text=“<%$ WebsiteResources : MSG000553 %>”></COM:Label>

			</div>
			<div class="line">
			    <COM:CustomLabel ID="lblArchivePlan" RenderLabelMode="Label" DisplaySemiColon="True" Text="<%$ WebsiteResources :  MULBL001408%>"></COM:CustomLabel>
				 <COM:RadioButton ID="rdForhideYes" CssClassLabel="lblradio" GroupName="Archive" 
                     Text="<%$ WebsiteResources :  LBL000865%>"/>
                <COM:RadioButton ID="rdForhideNo" CssClassLabel="lblradio" GroupName="Archive" 
                    Text="<%$ WebsiteResources :  LBL000866%>"/>
				</div>
			<div>
			   <COM:TextBox ID="txtDaysDelay" CssClass="line" ClientIDMode="Static" MaxLength="2" 
                   RequiredFieldErrorMessage="<%$ WebsiteResources :MSG000470%>"  
                 ValidationExpression="^(\d?[1-9]|[1-9]0)$" RegularExpressionErrorMessage="<%$ WebsiteResources :  MSG000555%>"   
                   Label="<%$ WebsiteResources :  MULBL001409%>"/>
                
			</div>
			<div class="line">
			    <COM:TextBox ID="txtArchiveTables" MaxLength="500" Label="<%$ WebsiteResources :  MULBL001410%>" CssClassTextBox="w60" Width="100%" >
			        
			    </COM:TextBox>
			</div>
		
		<div class="send flottant">
		    <COM:ActionButton ID="btnReinitialize" CssClass="bton" OnClick="BtnCOMeClick" 
                     Text="<%$ WebsiteResources :  MULBL001717%>"> 
		    </COM:ActionButton>	
		</div>

</dot:Content>

Please help to provide experience and Challenges/feedback/Best practices for such migration using DOTVVM.

2

Hi! Sorry, I couldn’t figure a good answer, as the question is quite generic and there are caveats to everything. I guess one month after posting, you have already made the decision. If not, or if you have chosen DotVVM in the end, feel free to specify more details and I’ll try to answer more specifically to your problem.

Anyway, generally:

  • Performance: If tight SLA means what I imagine is tight, just choose razor pages (or nextjs, sveltekit or something else). However, if your solution works fine in webforms, you are unlikely to hit a wall with DotVVM. You might with Blazor as that works kindof differently.
  • Minimal effort and cost: Honestly, this is very much impossible to say.
    • If you already have lot of jquery-like JS code you want to reuse, maybe again razor pages will give least headaches (of the three choices). I don’t know the current situation in Blazor, but they are doing their own client-side things, so it’s unlikely to be without issues. I’d imagine Blazor client will be OK, but Blazor server will be tough. In DotVVM, integrating with JS code should be OK, but since DotVVM also does it’s own client-side things it won’t be drop-in. I’ll be happy to provide more details, feel free to ask - we don’t have that many guides on it, but everything is possible.
    • If you have lot of simple forms (simple in terms of UI), this is where DotVVM shines.
  • Minimal learning curve:
    • Again this is impossible to tell, depends on how much you’ll need from the framework and how much you already know. In terms of complexity, I’d say razor pages are definitely simpler than DotVVM, which is probably simpler than Blazor. However, simple does not mean you won’t need to learn bunch of other things to solve your problems; and complex does not mean you have to learn every simple aspect of the framework. I mean C is simpler than C++ or C# or Python, but it might not be faster to learn what you’ll need…

To your more specific questions:

a. I feel I need to rewrite UI with fresh DOTVVM controls as I am not using standard controls.

  • You can use any web-compatible technology with DotVVM, it might “just” require some work integrating. Our default controls (open source or commercial ones) are just provided for convenience.
  • If you want a purely server-side component, you inherit DotvvmControl, write out the HTML in RenderContents and you are done. Add Postback.Update=true to update it on every command (“postback”).
  • If you want to use a purely client-side component, the “least work” approach is probably to wrap as a knockout binding handler and the you can just bind it in page with <div data-bind="my-knockout-binding: MyViewModelProperty"> (learning knockout.js basics is advisable in this case)

b. Getting feeling that creating same look and feel will be good effort but still 1000 % will not achievable

  • similar answer as a. 100% is achievable, but the effort might not be worth it if your code heavily intertwined with webforms.

c. MVVM need to be introduced.

  • yea. The viewmodel is the only easiest way to transfer data client->server, so you’ll need to migrate. If you just need to spit out HTML and you are done, there is no need to use it.

d. I am having other application using MVC razor views so different learning curve as well

  • yea
    • If you think you can reasonably easily do the things you need in the razor pages, I’d probably recommend this route.
    • If like more automagic forms and easier synchronization of state client-server, then I guess DotVVM
    • If you want to run code in the browser and seriously hate JavaScript, then Blazor