Related
I am beginning to develop an Enterprise level web application. The application will have many separate web pages but two of those pages being more focused and very heavy - heavy as in a lot of user interaction, modals that display mass data, websocket connections, chat, etc.
I have been assigned to Chief Architect on the project, so I am doing some research into the latest web frameworks. For the back end, we have done some testing and have decided to go with the Azure SQL platform. So far, I am liking the improvements that have been made, and are being made, to ASP.NET with Core 2.0. Specifically the Razor engine, over previous versions of ASP.NET MVC.
I wanted to get some expert opinions on the "new" Razor vs. Angular/React and the like. I'm particularly more concerned with performance. How does Core 2.0 Razor hold up to client side rendering frameworks? Are the differences negligible? Our app is targeting a potential 1,000,000 users (roughly 100,000 concurrent).
We ended up going with an Angular front-end and an ASP.NET Core API backend, using Azure SQL. We tested Core Razor and, although better than legacy Razor, Angular was much faster for us in the end. As far as user experience goes, Angular (or React) is far superior in terms of performance. The model-binding aspects of Angular we found to be a gigantic advantage of server-side rendering. Using Razor(or server side rendering in general) does, however, lend itself to better overall integrity as far as data goes and it makes for a better transition of data from front-end to back-end. There is a true disconnect between a front-end framework and an API. All data that is passed to the server has to be cast into typed objects - this means you have to manage two separate POCO model sets. This can cause issues if server objects and front-end objects do not align. At the moment, Entity Framework Core is not very matured so we have issues with updating objects, querying objects, including child objects, etc.
Overall, this setup has worked out great for us so far! I would imagine React would be a similar replacement to Angular if you're more comfortable with it. I had to learn Angular, which was a very easy transition, and I love it now!
By using Angular/React with API on the server-side:
you eliminate the process of generating HTML on server-side and you save CPU
API produces a small payload (JSON) and Razor (HTML) of course would be much larger in size, the constant full page reloads, and postback round trip, so API and SPA save bandwidth
API and SPA could have different versioning, scaling and deployment scenarios
By using API you can support mobile app too and if you start with Razor you may need API in future
But by using Angular/React, you should be worried about clients:
client must enable javascript
client must have modern browsers
client must have enough powerful hardware
SEO
I don't have benchmarks. But, I have several projects running JQuery, Razor, .NET MVC (C#), AJAX. Not to the scale you're tackling.
Advice.. Be sure to think things through and follow best practices. To keep things maintainable be sure to break controllers, views, model into smaller and meaningful groups. When I started, I made the mistake of putting everything into one Home controller, and a ton of views in the shared folder. Was fine at first but when feature creep began, it became a mess and difficult to go back and redesign.
I also use Linq2SQL. I made the mistake of creating models for everything and then realized I could just return the result set from my queries as a model. duh.
If you go .NET MVC and are concerned about performance, these are the things I ran into:
DON'T return partial views that create large blocks of HTML! Be sure to minimize everything. Get rid of all the white space. Use smaller ID names. Take the time to create html that is as light as possible. Return JSON and have the client do some of the work.
Be careful on how you develop your CSS. Don't use a bunch of inline styles, take the time to incorporate into CSS files that you can later minimize.
Same goes for your client side JS. It's tempting to put the JS inside partial views. Keep things organized.
Rendering on IE is horrible. Especially if there are lots of images. Be sure to compress images as much as possible, without losing quality of course.
React vs Angular
Basic Security on client side environment in Angular while React security not provide.
Angular execution slow while React execution is fast due to virtual dom.
Angular code is not 100% customize while react code is 100% customize.
Default Typescript in Angular while React use Javascript and Typescript Both. This is the main reason many developer like React because developers like JavaScript
I want to build web app with real time communications with other web app via WebSocket.
For making WS one connection it's better to build SPA app.
Unfortunattely Angular 2 + Asp.Net Core seems not to be clear and stable.
Furthermore I want to use Asp.Core libraries such as Identity
May be its better to use ViewComponents and reloads them according to WS messages without reloading View?
Any Idea about better app architecture?
Friend, you appear to be in way, way, way over your head. Let me just provide some very basic assistance to try and move you in the right direction.
If you are going to be using ASP.NET or ASP.NET CORE for real-time communications, you would likely use the ASP.NET SignalR library. SignalR (https://www.asp.net/signalr) supports Web Sockets but falls back to other techniques for older browsers which do not support them. It is very feature rich and integrates well with legacy ASP.NET or ASP.NET Core. (Microsoft provides versions for both.)
ASP.NET Core is stable now, but it is still not feature complete--particularly in regards to Entity Framework. However, for most green-field applications, that is to say, most new development, ASP.NET Core is a perfectly reasonable development choice. ASP.NET Core offers many great benefits--like the ability to deploy your .NET code on a Linux server. Application builds are much faster than legacy .NET (e.g. .NET 4.6).
Yes, ASP.NET Identity is a great choice for Identity Management (although I typically use IdentityServer4.) You will most certainly need to extend ASP.NET Identity to use it. (For example, most people extend AppUser with custom user properties. For a Single Page Application, you will probably also want to use JSON Web Tokens (JWT) (https://jwt.io/)). There are many other extensions to ASP.NET Identity you can (and probably will) make. They all require some basic familiarity with ASP.NET Identity's internal architecture. (I recommend the tutorials from Taiseer Joudeh. (http://bitoftech.net/category/asp-net-identity/) They are for ASP.NET 4.x but can be easily migrated to ASP.NET Core. The output of these tutorials can also form a really great foundation for your own identity system.
To develop a SPA (Single Page Application), you are going to want to use a front-end framework. By far, the two most popular frameworks are Google's Angular2 (http://angular.io) and Facebook's React (https://facebook.github.io/react/).
Based on what I am gathering from your post, you may not have much experience in these technologies. ASP.NET Core, SignalR, the (necessary) extension of ASP.NET Identity, Angular2/React, all have significant learning curves. By significant, I really mean SIGNIFICANT--which you can measure in months.
You will need to be familiar with Gulp to use as a Task runner under ASP.NET Core. I recommend using Visual Studio 2015 or Visual Studio 2017 for ASP.NET Core development. You can also get by quite nicely with Visual Studio Code.
Beyond that, there are a whole host of other tools you need to be familiar with to effectively develop for these platforms--particularly on the front-end.
For example, to do effective Angular2 development (which is my recommendation for SPA front ends), you are going are really going to need to know or be able to use all of the following: Git, ES6, TypeScript, RxJS, JSON, Node, NPM, angular-cli, Jasmine, Karma, Protractor, CSS, Sass/SCSS, Bootstrap or Angular Material, Webpack, Angular Universal, etc. There are actually quite a few other tools/libraries you will want to utilize, but this will give you a good enough starting point.
On the client front end, you will most assuredly not want want to use Visual Studio. It is a real pain to set up for front-end JavaScript development. (The Angular2 setup for Visual Studio 2015/2017 is a bear.) You will probably use Visual Studio Code, Sublime Text, Atom, or Webstorm.
Most organizations employ an entire team of people to work on SPA apps. Some of the team members may include the following: Graphic Designer, CSS Themer, Front-End Javascript Developer, Back-End Server Developer, DBA/Data Architect, Requirements Analyst, Build/Testing Specialist, Tester, Network Administrator, and Project Manager. Of course, in many projects, one person may fill multiple roles--or people may share roles. The key point is that SPA projects are complex enough that most projects have at least 2-3 team members--and often more. Even then, very experienced folks can still struggle to get those apps into production.
One question that I would also ask you is, "Do you really need a Single Page Application?" SPAs are great--really great! However, they require significantly more knowledge to develop and have much more complexity than other applications. If there is a good use case for developing an SPA, then more power to you. If not, then you might consider stepping back and doing something a little less ambitious until you get a better handle on what is possible.
I am not saying all of this to discourage you. I am simply trying to paint a realistic picture of what you need to be able to actually build and deploy a production SPA. I want you to know what you are getting yourself into and have somewhat of a guided path to success.
Good luck out there, my friend!
Update: Added more detail on my current tool-set from a letter to a friend.
I have a good friend who is wanting to become a Web developer. I recently laid out a road map to assist him in his studies. I am simply copying and pasting that road map (and my letter to him) here to provide some additional details on the tools that I use (and mentioned above) along with some hint on the relative effort required to use them. He is just starting out so my descriptions of the tools are relatively non-technical. These are merely the ones I use, so please don't flame me if I left out your favorites.
...I wanted to go ahead and offer you a roadmap of where we are going by giving you a preview of the tools that I actually am using right now in my "development stack." (A "development stack" is the list of tools a person uses to code, build, and deploy projects.) Eventually, you will probably be using most of these tools (with the possible exception of some of the back-end development tools) or others that come after and replace them. This "stack" represents the tools that many of he top developers tend to use--although every developer has his own favorites. If you are going to jump head-first into this Web development career, then I am assuming you are going to want to be the best--because that is where the most rewarding projects are to be found--and the most lucrative ones as well.
As you read this list, you will probably be a bit overwhelmed by the sheer number of tools. I do this everyday, and I am still a bit overwhelmed by it. First, let me say that I do not necessarily use every tool everyday, but I do use every one of these tools sometimes. They are all indispensable to have in your arsenal. Second, let me also say that I am not an expert in every tool. You won't need to be either. There will be some tools that you absolutely master, some tools for which you need a very strong working knowledge, and some tools you just need the basics to get you by.
As we go forward, I am going to help you move in a very organized way of learning these tools. There are thousands of tools out there--many of which are useless or inferior. Knowing which tools you actually need will help focus you and prevent a lot of wasted time as you learn and grow. Beyond that, I will help you to get acquire the right knowledge in the right order to make the learning process as efficient and comfortable as possible.
It is perfectly fine for you to go ahead and begin to get familiar with some of these tools on your own. If you visit a site page and it all looks like gibberish now, don't worry about it. In a short while, it will all begin to make sense.
One thing I would note is that new tools are being introduced everyday. The technology is constantly evolving. I fully expect that, by the time you reach a moderate level of proficiency (some months from now), some of these tools may have begun to fade or even have been replaced entirely by others. Regardless, having learned the current incarnation of a tool will allow you to easily master the replacement tool.
I have categorized the tools in a somewhat logical order and provided a description for each tool; a link to a website; the required mastery level (Basic [working knowledge]|Strong [working knowledge]|Expert); and the approximate learning curve (assuming you were studying these things full time) to reach the required level of proficiency. Please note that many of the tools (e.g. code editors) can be used to some minimum level with a much lesser learning curve.
Code Editors
The first thing you are going to need for development is a good code editor. All of these are free (or have free or unlimited evaluation editions). I generally use Visual Studio Code for my front-end (Browser / JavaScript) development and Visual Studio 2017/Visual Studio Code for my back-end development (server side development.)
In addition to the core application, all of these have extensive libraries of community plugins. You will want to familiarize yourself with the available plugins and choose the ones which suit your needs and interests.
Visual Studio Code - http://code.visualstudio.com/ - Expert, 1 Day
Sublime Text 3 - https://www.sublimetext.com/3 - Expert, 1 Day
Atom - https://atom.io/ - Strong, 4 Hours
Visual Studio 2017 - https://www.visualstudio.com/vs/community/ - Expert, 1 Week
Core Web Technologies
HTML 5 - The core markup language of the Web. The structure of of Web page is defined in HTML. This is fundamental to everything else we will learn. https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/HTML5 - Expert, 1 Week
Cascading Style Sheets (CSS) 3 - While HTML defines the structure of Web pages, CSS defines the thematic or stylistic elements (e.g. color, typographic, spacing of elements, etc.) of a page. CSS provides the "look and feel" of a page. For many good reasons, the structual and stylistic elements are kept entirely separate. https://developer.mozilla.org/en-US/docs/Web/CSS, https://developer.mozilla.org/en-US/docs/Web/CSS/CSS3 - Expert, 2 Weeks
JavaScript / EcmaScript / ES5 - JavaScript is the primary development language for the front-end--that is, to say, the browser. It handles much of the "interactivity" on a Web page but also provides functionality for sending data to and receiving data from the server in the background. JavaScript is the essential ingredient in modern Web applications. - https://developer.mozilla.org/en-US/docs/Web/JavaScript, Expert, 1 Month
Core Web Technologies Plus
While the core technologies are essential for any Web development project, they are simply not enough for serious Web projects. A number of frameworks and related tools have been developed on top of these technologies to either extend their capabilities or simplify their implementation.
Bootstrap 3/4 - Bootstrap is a CSS framework that simplfies theming sites and also makes them much more standard. CSS theming can be very tricky and difficult. However, Bootstrap will greatly speed your development. The current version of Bootstrap is 3. Version 4 is in alpha. We will learn both as version 4 primarily extends (and further simplifies 3.) We will learn Bootstrap 3 also because it is helpful in learning Bootstrap 4 and most companies are still using it--so you will probably need to know it. http://getbootstrap.com/ - Expert, 1 Week
Sass / SCSS / Syntactically Awesome Style Sheets - CSS can be tricky, cumbersome, and very time consuming. Theming a website can take days or even a week or more. This is time that can be filled with much pain and many tears. Most of the frustrations in CSS come from the way different browsers implement (or fail to implement) the standards. Sass is known as a "CSS pre-processor" and helps to speed CSS development and also helps to fill in the gaps for functionality vendors failed to implement in a standard way. Sass (or its latest SCSS implementation) will eventually become your trusted and well-loved friend. http://sass-lang.com/
Google Fonts - Typography can make a mediocre Website really "pop." Google provides many free Web fonts that can be used easily in any site. https://fonts.google.com/ - Strong, 2 Hours
Font Awesome - Font Awesome provides many useful and standard icons which can be included on websites. You will make use of Bootstrap, Google Fonts, and Font Awesome in almost all your projects. They all work well together. - http://fontawesome.io/ - Strong, 2 Hours
ES6 / EcmaScript 6 / ES 2015 / EcmaScript 2015 - Plain old JavaScript (ES5) has some serious limitations. A newer version of the language was released in 2015 which adds some much needed functionality. Unfortunately, not all browsers support this latest version. Fortunately, there are translators (called transpilers (e.g. Babel)) which can allow us to write ES6 code and then translate it back into the older JavaScript that browsers understand. We will definitely be mastering JavaScript, ES6, and its successor (TypeScript, described below.) - http://es6-features.org/ - Expert, 2 Weeks
TypeScript - While one could consider ES6 to be a wrapper around plain JavaScript that provides additional functionalities, TypeScript can be viewed as a wrapper around ES6 which provides newer JavaScript functionality which was not part of the ES6 standard. In other words, TypeScript > ES6 > JavaScript (ES5). Just like with ES6, TypeScript can be translated (transpiled) back into either ES6 or ES5. Angular 2 uses TypeScript for its development. A mastery of TypeScript will not only be necessary for other Web development, but it is also necessary for learning and mastering Angular 2. NOTE: Eventually, all of functionality in TypeScript will make it's way into the browser (as will ES6) and the transpilation step will no longer be required. - Expert, 2 Weeks
Babel - Babel is the tool you will use to tranform or transpile ES6 to plain old ES5 JavaScript. The tool is very simple to use. Most of the time, this will be managed for you in the background (by your build system - Webpack or Gulp). Still, it is necessary to have a basic working knowledge of the tool. - https://babeljs.io/ - Basic - 4 Hours
(Google) Chrome Debugger OR Safari Web Tools - Both Google and Safari are based on a browser engine called Webkit (https://webkit.org/.) Both include essential (and almost identical) tools for debugging Web pages. You will need to absolutely master the Chrome Debugging tools, and this is something that will eventually happen with continued use. You'll spend some time initially getting familiar with these tools and will then proceed to a deeper more intimate knowledge of them as you use them. - https://developer.chrome.com/devtools - 1 Day
Web Frameworks
Angular 2 - Leading JavaScript framework provided by Google for developing "modern Web applications." Angular 2 is very much the future of the Web. It is fast and powerful. Angular 2 developers are also in extreme demand and are very well ($$$) paid. This is the first framework we will learn, and it has a fairly steep learning curve. We won't even begin to study it until we have a near mastery of JavaScript, ES6,and TypeScript. - http://angular.io. - Expert, 1-2 Months.
React - Leading framework provided by Facebook for developing "modern Web applications." Frankly, I am not a huge fan of React, but many developers love it. I think you definitely should learn it because 1) there are many React jobs, and 2) learning React is very easy if you already know Angular 2. It just makes you much more marketable. - http://www.typescriptlang.org/ - Expert, 1 Month.
In addition to just the core "Angular 2" framework, there are at least three other supplemental "power tools" you will need that help you to really be able to take Angular 2 to its full potential.
Angular-Cli - The Angular Command Line Interface (CLI) allows you to quickly generate boilerplate Angular 2 code files and perform a variety of useful tasks. I have found this tool to be indispensible, and it greatly enhances my productivity. - https://cli.angular.io/ - Expert, 1 Day
Angular Universal - Angular Universal is a tool for generating/rendering elements of Angular 2 on the server rather than in the client's browser. This can dramatically improve load times and making the page more search-engine friendly. Angular Universal is a key component of Search Engine Optimization (SEO) with Angular 2. - Strong, 1 Week
Reactive Extensions for JavaScript / RxJS - RxJS is a library that provides core functionality for building modern Web applications. It's foundation component is an entity called an "observable." For the moment, Observables would be bit challenging to explain other than to say this. An Observable kind of "subscribes" to a piece of data and then allows the system to "do something" when that data changes. While this may seem trivial, it is not. It opens the door to much other functionality. This is an advanced concept used in Angular 2--and one we will explore deeply concurrent with learning that framework. - https://github.com/Reactive-Extensions/RxJS - Strong, 3 Days
Core Tools
NodeJS - NodeJS is a Javascript "environment" based on the JavaScript engine found in Google Chrome. It allows you to run JavaScript applications outside of a Web browser. Most of the tools we will use involve NodeJS in one way or another. Initially, you will just need to develop a very basic familiarity with NodeJS, but you would be well served to deepen this knowledge over time. - https://nodejs.org/en/ - Basic, 4 Hours
Node Package Manager / NPM - The Node Package Manager (based on NodeJS) is the tool we use to download most of our other software and libraries. Almost every other package we have listed in this document is installed using NPM. It is a simple but indispensable tool. https://www.npmjs.com/ - Basic, 4 Hours
Task Runners
As noted in the ES6 and TypeScript descriptions, there are often multiple steps to get your original source code files into a format where they can be deployed into production--or even run/viewed locally in your browser. To get your ES6 files into old-style ES5 JavaScript, you will use Babel. To transpile your TypeScript files into ES6 or ES5, you will use the TypeScript compiler (tsc). You will want to perform these translations every time you modify a file. Beyond simply compiling, there are often many other tasks you will repetitively perform such as moving files from your source code directory to your "build" directory (the directory where you will run the files) on your PC. Sass also will be converting your SCSS files to standard CSS files. Suffice it to say, there are many repetitive tasks that you will not want to do manually. A "task runner" will do them for you.
Two task runners we will use are Gulp and Grunt. Gulp and Grunt allow you to define a series of tasks into some "command" and then have that command (optionally) run automatically for you whenever there are file changes. Gulp is the primary task runner you will use. Grunt is kind of falling by the wayside but is still in widespread enough use that you will need to be familiar with it. There are also many "plugins" for these systems you will also become familiar with and use.
Gulp - http://gulpjs.com/ - Expert, 1 Day
Grunt - http://gruntjs.com/ - Strong, 4 Hours
Build Systems
While Gulp and Grunt can help you build and deploy your Web sites / Web applications, there are two other systems which are particularly suited to this task. You will eventually need to become very familiar with both of them. Angular 2 uses Webpack.
SystemJS - https://github.com/systemjs/systemjs - Expert, 1 Day
Webpack - https://webpack.github.io/ - Expert, 2 Days
Docker - Docker is technology used for packing sites into containers and deploying the site as a unit. It is relatively new, but the entire market is moving to use it. You will be well served to know it. - https://www.docker.com/ - Working, 1 Day
Source Code Versioning and Control
Git - When developing websites, you will need to be able to track your changes and roll back to a previous version if something goes "horribly wrong"--which it often will. Git is, by far, the most popular version control system. Also, many websites (like GitHub) allow you to use it to pull down software from their sites (called repositories.) You will want to be very familiar with Git. - https://git-scm.com/ - Basic, 4 Hours
JavaScript Testing Tools
Testing is a critical part of any development. It also happens to be one of the most time consuming. You will eventually get familiar with a number of different test tools--all of which perform slightly different functions.
Jasmine - JavaScript Unit Test Framework - https://jasmine.github.io/ - Strong, 1 Day
Karma - JavaScript Test Runner - https://karma-runner.github.io/1.0/index.html - Strong, 1 Day
Protractor - End to end (e2e) test Framework for Angular - http://www.protractortest.org/ - Strong, 1 Day
Istanbul - Code coverage analyzer for JavaScript - https://github.com/gotwarlost/istanbul - Strong, 1 Day
.NET Development
Once you master client-side development, you may decide you want to learn server-side development as well--or you may feel perfectly comfortable continuing to focus on the client. Either is fine. Just for the sake of completeness, here are the tools I genereally use for server-side development.
ASP.NET Core - Microsoft's new server-side web framework which runs on Windows, Linux, and OS/X. The framework is very robust and highly performant. ASP.NET is used by many businesses for developing core line-of-business applications. For example, many banks use ASP.NET or ASP.NET Core to develop Internet banking websites. - https://www.asp.net/core
ASP.NET Identity - This is the Microsoft library for handling user and account management. This is actually a large part of the functionality in any Web application and has a number of very complicated pieces. ASP.NET Identity does most of the heavy lifting but is also very extensible. - https://www.asp.net/identity
ASP.NET SignalR - SignalR allows for real-time communications between a client (typically) and a browser--generally using a technologically called Websockets. Some example applications might be real-time chat, massively multiplayer online games, or a real-time stock ticker. - https://www.asp.net/signalr
Entity Framework 7 / Entity Framework Core - Much of the effort required to code back-end applications relates to storing and retrieving data from a database. Entity Framework abstracts much of that functionality and provides a much simpler way to store and retrieve data. https://www.asp.net/entity-framework, https://github.com/aspnet/EntityFramework
Microsoft SQL Server - Microsoft's database implementation. SQL Server works well with other Microsoft tools. It is great, and I have been using versions of it since 1995. However, I sometimes use MariaDB (https://mariadb.org/) and have been considering using PostgreSQL (https://www.postgresql.org/) or MongoDb (https://www.mongodb.com/) for some future projects. There is a free version of SQL Server available for development. All of the other database platforms mentioned are already open source. - https://www.microsoft.com/en-us/sql-server/sql-server-2016
Redis - Redis is a super-fast in-memory database. It is used by most of the high-end websites (including Facebook) for data-caching. Use of Redis in conjunction with SQL Server or MariaDb can greatly improve the overall performance of a website.
NUnit - NUnit is a unit test framework for .NET--which I used on the back-end. https://www.nunit.org/
Development Resources
There are a number of websites I access on a regular basis to assist me with development. The most important site is Stack Overflow which has over 12 million questions and answers on almost any development topic. It is an invaluable resource, and I use it every day. You will definitely want to create a free account there. I also frequently access GitHub to download various software and use Google to query thousands of other sites for specific information.
Stack Overflow - https://stackoverflow.com/
GitHub - https://github.com/
I am starting a new app that will target both web and mobile (but possibly only as HTML5, not necessarily a native app)... So, what are the frameworks you guys recommend? I am familiar with plain ol' ASP.NET, and some minimum AJAX. So is it best, for example, to build a ASP.NET REST based API with a JQuery and JQueryMobile?
I'm looking at a similar approach while we're commercializing an app of ours.
Considerations
After 5 months of research and experience combined with the comments above, here are some considerations:
Do you have control over your users' browser selection? If yes, HTML5 is a great and flexible. If your users are more up-to-date I would also recommend HTML5.
The server-side framework in most cases will not matter, as long as you can develop a robust server with an efficient data model that's familiar and manageable.
Are your mobile devices tablets or phones or both? If you are using phones it will be harder to fit and prioritize the interface.
Do you know all of your app's functionality? This will be important for determining UX which will then help you understand how you will build out the client.
Is your app real-time? And you have modern users? Websockets are handy. Here's a demo for ASP.NET http://wsaspnet.codeplex.com/
Recommended Frameworks
Given your case, here are some recommended frameworks to make life easier:
Stick with .NET on the server-side since you are familiar with it
Use backbone.js to manage your client-side template
HTML5 boilerplate is also worth a look http://html5boilerplate.com/mobile
Use the latest JQuery library
Use JQuery Mobile to adapt your HTML5 app to mobile devices
There's also JQTouch http://www.jqtouch.com/
Custom build your "fluid" javascript to adjust your client to different interfaces (I haven't been satisfied with current plugins and frameworks)
If you are using websockets, web-socket-js is very handy for a flash fallback https://github.com/gimite/web-socket-js ...otherwise stick with AJAX REST
Consider PhoneGap to adapt your app if you need to distribute the app in approved marketplaces outside the browser http://phonegap.com/ and https://build.phonegap.com/
Here's a C# Websocket server: http://www.codeproject.com/KB/webservices/c_sharp_web_socket_server.aspx
Remember
Sometimes it is just necessary to build a separate client for mobile if your app is complex. It can be native, HTML5, or HTML5 put through PhoneGap.
Over the past 6 months I've been developing web sites using asp.net. When I design something such as a contact form, 99% of the time I find myself using a script manager and update panels. Recently I tried out silverlight and expression blend, and I love it.
Is there any big cons for me to start building my forms with silverlight instead? The only big one I can think of is the user might not have silverlight and not want to download the plugin.
I guess to solve the has and has not issue, I could make a silverlight version and a standard version until it comes to the point where the plugin is as popular as flash.
Personally i would advocate doing everything in SL because i love what you can do with it. But common sense dictates otherwise. There is no point replacing relatively static webpages with a SL app. While there are methods to communicate/cooperate between SL apps and the web pages that host them, you don't really want to do this unless you have to, you can end up with quite a kludgy solution.
SL is not suitable for everything. The times you want to use it are when you can redo (or create) a whole web app (or significant chunks of it), and you want to create a more immersive and interactive desktop-like experience for the user. You also need to read up on authentication with SL and WCF services, SL navigation, and become familiar with the SL4 Out of Browser feature as it offers you some features/benefits beyond what is available to an in-broswer SL app.
The Silverlight plugin is not available in mobile devices. Also, SL 3/4 is not yet 100% supported in Linux.
You really have to take in consideration your targeted audience.
If your app is meant to be used anywhere SL or event Flash is not a good choice. None of them run on iPhones for instance.
The Silverlight platform is a good compromise between the richness of a fat client and the easy of deployment of a web app. Intranet environmentss are great candidates to take advantage of that.
The platform runs well in both Windows and Macs, and should get better in Linux too.
We need to build an administration portal website to support our client/server application. Since we're a .Net shop the obvious traditional way would be to do that in ASP.Net. But Silverlight 2 will be coming out of beta a good while before our release date. Should we consider building the whole website in silverlight instead, with a supporting WCF backend?
The main function of the portal will be: users, groups and permissions configuration; user profile settings configuration; file upload and download for files needed to support the application.
I think the main reason for taking this approach would be that we have good experience with WPF and WCF, but little experience in ASP.Net. Either way we would have to learn ASP.Net or Silverlight, and learning Silverlight seems a more natural extension of our current skills.
Are there any big no-nos from the experience of StackOverflowers? What are the big positives?
I would recommend against building a pure Silverlight site.
Silverlight suffers from the same issues as Flash does: Unintuitive Bookmarking, issues with printing, accessibility issues, not working back buttons and so on.
Also, you would require your users to have Silverlight installed or at least to have the ability to install it.
In controlled environements (eg. in large companies or health care) or on mobile devices, this might not be the case.
I would definitely go for a full Silverlight application, specially if you have good experience from WPF. You will be able to reuse your knowledge from WPF, and should be able to pick up Silverlight fairly quickly. I've been working with Silverlight since Beta 1, and the current Beta 2 is of solid quality. I guess it's safe to assume that a RTW version is just around the corner.
Pilf has some valid point, specially around printing. For that I would probably use SQL Reporting Services, or some other reporting framework, on the server side, and then pop up a new window with printable reports. For linking and bookmarking the issues are no different than any other AJAX application. I did a blog post today about how to provide deep linking and back-forward navigation in Silverlight.
Silverlight also has all the hooks needed for great accessibility support, as the UI Automation API from WPF is brought into Silverlight. I don't know if the screen reader vendors have caught up yet. The styling/template support in Silverlight makes it easy to provide high-contrast skins for visual impaired users if that is a concern.
Depends on your goals. If administration portal is part of application and will only be used from computers where your application is installed, there are plenty of advantages of going fully Silverlight - or even WPF.
But if you can see a scenario where it will be used either from random PC or by random person, fully functional HTML/Javascript version is absolutely necessary.
Some reasons are:
Most people don't have silverlight and you'll earn a good load of swearing if they have to download and install it. Some people who have it installed keep it disabled (together with flash and sometimes even images) to avoid distractions and speed up browsing.
When HTML site fails, user gets error page and reloads. When silverlight fails, it can hang or crash.
HTML is what is expected - both by users and web browsers: back and refresh buttons work as they should, hyperlinks and forms work as expected.
Slow internet is still very common, both in remote areas and mobile devices.
I agree with what everyone had said so far and I think this Flow Chart, which is aimed at Flash, also applies to Silverlight.
Source of Image
It sounds like your problem is that you need a rich-client admin application. Why not use click-once?
On the topic of remote andministrators, another poster stated that was an argument in favor of HTML if the admins were on a slow connection. I would argue that depending on the type of information, it may be more efficient to use Silverlight. If you have an ASP.NET datagrid populated with server side data binding, you can be downloading a ton of markup and viewstate data. Even if you're using an alrternative to DataGrid that's lighter on the ViewState, you will still have a lot of HTML to download.
In Silverlight, once you get the XAP down, which is probably going to be smaller than the corresponding HTML, the XAP is cached and so you shouldn't have that cost every time, and you'll just be retrieving the data itself.
For another example, let's say you have a bunch of dropdown lists on one of your forms which all have the same values in the list. In Silverlight, you can get these values once and bind them to all of the dorpdowns, in HTML you will have to repeat them each time.
This will get better with client side data binding in ASP.NET, which follows a very similar model to Silverlight and WPF for data binding.
Overall, I would also think that you would need to write less code for the Silverlight implementation which can increase productivity and reduce maintenace costs.
ASP all the way. You should only use silverlight/flash etc when text can't do what you want it to do - e.g. display video.
Using a plugin for your website makes it slow, and requires the user to have the plugin installed. Silverlight for instance rules out all Linux user. Also, since Silverlight is pretty new, there is no telling how committed Microsoft will be to keep the platform alive if it doesn't pick up soon.
I'd stick to plain old HTML with server side scripting.
Also, for public websites: Flash and Silverlight can't be indexed by any search engine, so good luck with writing tons of metadata if you want any visitors at all.
Silverlight is a good choice for an internal-facing portal, just as it would be for a public-facing portal if you've already evaluated your project and have decided to go forward with a web portal. You are free to integrate Silverlight components within an existing ASP.NET application (i.e. the "islands of richness") approach, but if you have the ability to build a new project from scratch, don't discount a completely Silverlight solution as a valid choice where you would have went with a traditional ASP.NET portal. Silverlight is RTW now, so if this decision is still on the table, you know you won't have to deal with breaking changes going forward.
There are some downsides with developing a site completely in Flash / Silverlight, but if those downsides won't matter to you or won't have an impact then there is nothing stopping you. Choose whatever tool you think meets your needs more fully. I wouldn't be put off creating a site purely in Silverlight based on the downsides, because it brings a lot more positives to the user experience.
The previous comments have dealt with most of the downsides of using Silverlight for a site like this and I agree. If you're determined to have rich-client style development and your audience is small (for admins only) then I'd probably recommend WPF over Silverlight as it currently provides a richer set of tools and controls.
If you stick with ASP.NET have you looked at Dynamic Data - it's ideal for building backend management sites with little effort.
I've seen "Silverlight only" websites at Microsoft and they are pretty impressive. But again, the demos were there to exploit the full potential of what Silverlight can do. The moment you need something different you may be out of luck. I don't see Silverlight like Flash except in the way they are installed/seen. But the Flash/ActionScript backend is really bad compared to what Visual Studio can offer with .NET
Ask yourself why would you like to use Silverlight? Fancy effects or programming model?