I am working on an MVC ASP.NET website, that is loaded by an external website into an iframe.
Is there any specific technique that can be used in the construction of an ASP.NET MVC website to make sure it loads as fast as possible into an iframe?
Thanks!
(NOTE: I have no say as to how the external website is built)
Browsers will treat your page the same as far as the downloads go, whether or not it is iframed, so "no" there's not a special technique you can use that is specific to IFrames. Things you'll want to look out for are SSL mismatch, and integration from the parent page to your page where you might hit XSS trouble. In general just use the standard optimization techniques available to you and everything should be fine.
Related
As a way of raising the standards of our codebase I would like all new web projects (where possible) to use MVC5 with Inversion of Control. I'd like to have a service, domain and repository layers. Plus Unit Tests to get them started.
Obviously this is a lot of code to do up front for every project, and I want to avoid "just copy ProjectXYZ and strip out what you don't need" as this has been fraught with human errors in the past.
How do I take my very basic skeleton solution and turn it into a template for my colleagues to do File -> New Project etc ?
They could just copy the .sln I create, but it seems like there might be a more professional way to do it.
Perhaps there is already one out there we can use?
I am the developer of ASP.NET MVC Boilerplate (I found this question by checking my GitHub traffic and seeing #floatas's link, so thank you #floatas).
The default MVC project template is too basic and gives you very little out of the box. The idea behind ASP.NET MVC Boilerplate is to write all the boilerplate code for you, so you don't have to.
Now it does not contain unit tests, repositories etc. but it does include a lot of other things that every website requires.
Secure By Default
The default MVC template is not as secure as it could be. There are various settings (Mostly in the web.config file) which are insecure by default. For example, it leaks information about which version of IIS you are using and allows external scripts to access cookies by default!
ASP.NET MVC Boilerplate makes everything secure by default but goes further and uses various HTTP headers which are sent to the browser to restrict things further.
It also makes use of the new Content Security Policy (CSP) HTTP Header using the NWebSec NuGet packages. CSP revolutionizes web security and I highly recommend reading the above link.
Setting up SSL/TLS, so that your site runs over HTTPS is made easy with easy step by step instructions and links.
Fast By Default
The default MVC template does a pretty poor job in the performance department. Probably because they don't make any assumptions about which web server you are using. Most of the world and dog that are writing ASP.NET MVC sites use IIS and there are settings in the web.config file under the system.webServer section which can make a big difference when it comes to performance.
ASP.NET MVC Boilerplate makes no such assumptions. It turns on GZip compression for static and dynamic files being sent to the browsers making them smaller and quicker to download. It also uses Content Delivery Networks (CDN) by default to make common scripts like jQuery quicker to download (You can turn this off of course but the point is ASP.NET MVC Boilerplate is fast by default).
That's not all! There are a bunch of other tweaks and examples of practices which can help improve the performance of the site. ASP.NET MVC Boilerplate achieves a score of 96/100 on YSlow (Its not possible to get the full 100 as some of it's criteria contradict each other and site scripts need to be moved to a CDN which you need to do yourself).
Search Engine Optimization (SEO)
The default ASP.NET MVC template takes no consideration of Search Engine Optimization at all. ASP.NET MVC Boilerplate adds a dynamically generated robots.txt file to tell search engines which pages they can index. It also adds a dynamically generated sitemap.xml file where you can help search engines even further by giving them links to all your pages.
ASP.NET MVC has some very useful settings for appending trailing slashes to URL's and making all URL's lower case. Unfortunately, both of these are turned off by default, which is terrible for SEO. This project turns them on by default.
It also includes an MVC filter which helps to redirect non-canonical URL's (URL's without a trailing slash or mixed case characters which are considered different URL's by search engines) to their canonical equivalent.
Accessibility
4% of the world population is estimated to be visually impaired, while 0.55% are blind. Get more statistics here. ASP.NET MVC Boilerplate ensures that your site is accessible by adding aria attributes to your HTML mark-up and special shortcuts for people using screen readers.
Browser Compatibility
Websites need to reach as many people as possible and look good on a range of different devices. ASP.NET MVC Boilerplate supports browsers as old as IE8 (IE8 still has around 4% market share and is mostly used by corporations too lazy to port their old websites to newer browsers).
ASP.NET MVC Boilerplate also supports devices other than desktop browsers as much as possible. It has default icons and splash screens for Windows 8, Android, Apple Devices and a few other device specific settings included by default.
Resilience and Error Handling
At some point your site is probably going to throw an exception and you will need to handle and log that exception to be able to understand and fix it. ASP.NET MVC Boilerplate includes Elmah, the popular error logging addin by default. It's all preconfigured and ready to use.
ASP.NET MVC Boilerplate uses popular Content Delivery Networks (CDN) from Google and Microsoft but what happens in the unlikely event that these go down? Well, ASP.NET MVC Boilerplate provides backups for these.
Not only that but standard error pages such as 500 Internal Server Error, 404 Not Found and many others are built in to the template. ASP.NET MVC Boilerplate even includes IIS configuration to protect you from Denial-of-Service (DoS) attacks.
Easier Debugging and Performance Testing Tools
ASP.NET MVC Boilerplate makes use of Glimpse (As advertised by Scott Hansleman here). It's a great tool to use as you are developing, to find performance problems and bugs. Of course, Glimpse is all preconfigured, so you don't need to lift a finger to install it.
Patterns and Practices
Doing things right does sometimes take a little extra time. Using the Inversion of Control (IOC) pattern for example should be a default. ASP.NET MVC Boilerplate uses the Autofac IOC container by default. Some people get a bit tribal when talking about IOC containers but to be honest, they all work great. Autofac was picked because it has lots of helpers for ASP.NET MVC and Microsoft even uses it for Azure Mobile Services.
ASP.NET MVC Boilerplate also makes use of the popular Less files for making life easier with CSS. For an example, it can make overriding colours and fonts in the default Bootstrap CSS a cinch.
ASP.NET MVC is a complicated beast. You can end up with lots of magic strings which can be a nightmare when renaming something. There are many ways of eliminating these magic strings but most trade maintainability for slower performance. ASP.NET MVC Boilerplate makes extensive use of constants which are a trade-off between maintainability and performance, giving you the best of both worlds.
Search
There is a lot more to implementing search in your application than it sounds. ASP.NET MVC Boilerplate includes a search feature by default but leaves it open for you to choose how you want to implement it. It also implements Open Search XML right out of the box. Read Scott Hanselman talk about this feature here.
Social
Open Graph meta tags and Twitter Card meta tags are included by default. Not only that but ASP.NET MVC Boilerplate includes fully documented HTML helpers that allow you to easily generate Open Graph object or Twitter Card met tags easily and correctly.
There is RehanSaeed/ASP.NET-MVC-Boilerplate, aspnetboilerplate.com and probably many more tools to generate starting template. They are open source and can be installed as a plugin, so you can change the way you like and give to your team.
If you still really want to create your own, you can follow these steps. I can't include them all here because they are quite long.
Is there much point to using angular js on top of asp.net mvc since they're kind of both doing the same thing? What are the advantages to using angular over asp.net mvc + jquery? What kind of scenario would you pick angular in? If you do pick angular in a microsoft environment, what would you run on the server side? Would it be something like Web API? Or is there still benefit of using traditional asp.net mvc?
This question is a bit subjective, however here was our reasoning.
Let the client handle rendering of pages, free up resources on the server.
Leverage built in caching of cache servers since we are just dealing with <html/> content.
Since the pages are cached the only traffic back and forth is json payloads.
We have been using NancyFx, but WebAPI or Service Stack would work just fine.
We wanted to build a responsive single page application and AngularJs fit the bill for testability as full feature rich framework.
AngularJs forces you into a pattern that we needed for JavaScript, in the past our jQuery heavy applications turned into functional spaghetti (That was our fault but being guided by Angular helped out a lot).
As with all frameworks pick the one that suites your needs
On my site http://www.reviewstoshare.com, I am using AngularJS along with ASP.NET MVC. The main reason I did not go all the way with AngularJS was that SEO is not easily achieved with AngularJS.
Keep in mind that my site was already built using ASP.MVC + Jquery for in page interaction as needed.
On the other hand there is still some "Ajaxy" nature to the site like comments, voting, flagging etc. Not too different than Stackoverflow itself. Before AngularJS it was a mess of Jquery plugins and functions within $(document).ready() callback, not to mention the JS code was not testable much.
In the end, I went with both.
If you fancy using Java Script framework then Angular JS rocks.
SEO could be the issue. You need to have deeper understanding of DOM and Java Script as compared to other famous JS Frameworks.
I ve developed a Proof of Concept - using Angular JS with Require JS using ASP.net MVC
You can have a look at it at the below given link
http://angualrjsrequirejsaspmvc.blogspot.com/2013/08/angular-js-with-require-js-front-end.html
I would like some opinions on the following approach to architecting a web application.
A user will navigate to a login page. After logging in, the user will be sent to what I will call a primary page. The idea is to have the primary page contain some common material at the top of the page along with a menu. Below the menu taking up the majority of the page is an IFrame. Each of the menu items, when selected, would load the appropriate page into the IFrame. Here is the main point. The user can navigate through the application using the various menu selections and carry out whatever those selections allow while the primary page remains loaded during the entire session, that is, until the user logs out or closes the browser. This approach does not follow what appears to be the more common paradigm where the browser completely replaces web pages with other web pages as the user navigates through the site. No page stays loaded during the entire session. Is leaving the primary page loaded during the entire session a good idea?
If not, what are the main concerns? Also, can you site any references to a different approach to accomplish the same application-like behavior?
If okay, is there any advantage to using MCV over Web Forms to obtain this behavior?
majority of the page is an IFrame
Iframes are bad. They always have been bad, they always will be. There a dirty hack.
Don't use iframes.
SPA
If you have a good reason not to use actual pages and redirects you can try one of those single page applications that seem to be popular.
I will however remind you that if you rely javascript you basically can't do SEO.
Progressive enhancement
As an aside read up on Progressive Enhancement. You should be doing that.
Partial views
If you like having a large portion of your website static then you can always load partial views over ajax and render them on the client.
Of course because your doing progressive enhancement your doing full page redirects and loads aswell. The partial view rendering on the client is just bells and whistles.
.NET
As for using C# frameworks I would personally recommend Nancy.
If you want to use ASP (god knows why) I guess you can use ASP.NET MVC, sure it's far from optimum but at least it's not ASP.NET webforms
I don't think it's the absolute evil, but your solution does not actually follow the "normal" behaviour of an HTML site, and browsing may be less intuitive.
Users will have problems for bookmarks or using back button, for example.
You will not be able to adapt the menu accoring to the current displayed content (or will have a hell of synchro problems!), for example showing wich section you are in.
The common solution for web is to use a layout, or two-step view pattern (see http://framework.zend.com/manual/en/zend.layout.introduction.html)
I don't know well webforms, but MVC is known as the standard de facto for most web applications and frameworks. It's nice because of the splitting of the roles and the organization it enforces.
We are looking to integrate the display of some of our models, as well as a payment process, with some of our client's websites. It seems that everybody is going the Iframe route, but this also looks to be rather outdated when compared to XSS techniques.
How would one go about using XSS in rails 3 to enable multi page browsing functionality of elements of our site in another's site? As I understand it, we need to get a correct JSON protocol going, custom rendering in the client's website of the JSON, as well as maintaining state between page changes in the payment process and shopping cart.
Iframes certainly seem easier, but I am open to discussion around this, and an explanation of using XSS.
You need JSONP to do Cross domain scripting. This is a good article explaining it: http://emphaticsolutions.com/2011/01/21/functional-widgets-with-rails-javascript-jsonp.html
Here's a discussion on iframe vs jsonp: JSONP vs IFrame?
Also learn more about JSONP: https://www.google.com/search?q=writing%20widgets%20with%20jsonp
I have a project that will basically be a large brochure html website. Although some content could possibly be database driven in the future. I use ASP.NET MVC for any database driven websites usually, but not sure whether to use it for brochure html websites.
You'd probably want to use Master Pages even if the content is static. Might as well use MVC to keep headers and footers consistent across the site. (Same goes for any language, really.)
You host only plain old html files in it for now. If the need arises for database-driven content, ASP.NET MVC's routing options make it easy to switch to a dynamic site without breaking the links.
We used the same approach for setting up a dummy website for SEO purposes until the real app was developed and the switch to dynamic content was effortless.
The good thing about ASP.NET MVC (as apposed to Webforms? I assume you're asking) is that you can just use basic html and have a designer design up brochure required. If this needs to be more "dynamic" at some stage with forms or CMS etc, using the existing plain html will be easier.
Also if you're using MVC already its a no-brainer...
Danny,
it's possibly also a choice over whether your project sponsor is wanting to pay for windows hosting or whether they go down the linux route. if you know for sure that the site would NEVER be required to take data from a database then you could actually create an app in mvc (your developer app) and then have that app generate the 'flat file' site out to html files. that way, you could store the elements that make up the content in your developer database and regenerate the entire site when required. This approach would reap dividends - for example you decided to add some jquery across the site, then this would do it all in a single hit.
this way of generating flat sites would mean that you could in theory have an engine that you used for multiple clients, changing only the css and content as required.
just my tuppence worth...
jim