Static content separation in JSF2.0 project - jsf-2

I need your help on below.
I have JSF2.0 application which runs on WAS8.5. I want to separate the static and dynamic contents as we want to use WAS server only for dynamic contents and IHS to server static contents for my application. My current architecture and design as follows:
Marked file serving flag as false in ibm-web-ext.xml file (IBM config file to say whether WAS to be served static content or Not).
We’ve used core JSF2.0 tages (h:outputStylesheet, h:outputScript and h:graphicImage) and also traditional html tags some places (link, script and img) to load static contents.
My understanding/Observation is,
1. When we load static contents using JSF2.0 components (styles using h:outputStylesheet component, java scripts using h:outputScript and images using h:graphicImage), all static contents will be served by WAS server as FacesServlet is responsible for reading the component and loading the resources accordingly. According to the JSF2.0 guidelines&standard, we should use JSF tags to load the resources like js, css and images.
2. When we load static contents using html tags, all the static contents served by webserver ie IHS
Now my question is,
My application is internet channel application where we want to serve the possible as quickly as possible. Technically, I want to use Core JSF tags wherever possible and use the WAS server to serve only dynamic contents to reduce the load.
Please advice me options to meet my requirement.
Thanks,
Nanjundan Chinnasamy

We have made the following code changes to achieve our requirement.
To server all images by IHS,
Use native JSF2.0 tag with value attribute like below.
This will generate the html source like below
We used the traditional html tags (used in JSF1.X) versions to load css and java script files like below
If we use h:outputScript and h:outputStylesheet tags available in JSF2.0, we have a name attribute which marked as mandatory. We unable to make it static reference using value attribute alone. We don’t have much documentation at MyFaces site to give references to you. Mean time, you can have a look the following:
https://myfaces.apache.org/core20/myfaces-impl/tagdoc/h_outputScript.html
https://myfaces.apache.org/core20/myfaces-impl/tagdoc/h_outputStylesheet.html
If you any other suggestion/comments, please do let me know. We will revert you with an update.
Thanks,
Nanjundan Chinnasamy

Related

TYPO3 8.7 is it possible to output a specific page with multiple url path s

I'm trying to integrate a vue.js application into a typo3 page.
I have a full functional TYPO3 instance where I can create own pages, edit the content and more. Now I want to add an existing vue.js application within this page.
Therefore I created an extension which added all necessary resources (js, css) and added an own content type which controls the integrations and configurations. The content type outputs a vue.js entry point. So far everything works. Smaller vue.js applications works as they should.
Now comes the challenge: When I want to create a more complex application which relies on the router functionality, I run into a problem.
Let's assume, I integrate my application into the page /shop and my application tries to render a product under /shop/product/some-id. This doesn't work. The URL processing is done by TYPO3 (as designed).
I tried to find a solution within the documentation but I'm not sure what I should search. I need a way to output the same page (/shop) regardless the following path. Does someone have a hint?
I found a solution. Within TYPO3 v8 is it possible to use the realurl extension for this purpose.
It is possible to define an own decode preprocessing function and analyse the current url.
$GLOBALS['TYPO3_CONF_VARS']['EXTCONF']['realurl']['decodeSpURL_preProc'][] = RealUrlManipulation::class . '->decodeSpURL_preProc';
Within this method is it possible to change the url for TYPO3 inner processing and set it to an known url.

Different Content/Style in Multitenant Application

What is the preferred way to go for creating a multi-tenant application with angular 4 (or above) as frontend?
I want tenant-specific content to be served via an API (like the stylesheet or a tenant-specific header/navigation) and store it in a database.
Currently, I use aspnetzero but I am stuck with the custom stylesheet. The Css is available at an Url from the backend (aspnetzero) and I get this Url from my abp session. But how do I link this css file without getting FOUC (flash of unstyled content)? Currently, I just use the link tag and set href to an angular-component variable that stores the url to my css file (it is set in ngOnInit). But then i get FOUC.
Maybe my whole architecture is wrong in my attempt. I am definitely open to entirely different approaches!

Does .html in the end of a URL mean that the webpage is static?

I know it's not a good question to ask, but sometimes I really need to know if a webpage or website is static or not.
Sometimes I see .html extension in many URL, Does that mean that those pages are static?
.html extension means that page contains only front-end code and does not have any server side language included in it (I'm not talking about URL rewriters that adds .html to the end of virtual path).
This does not prevent these things:
Page can load it's content via Ajax depending on inputs, URL params, time of day, etc.
Page can be generated as static HTML page, but still be re-generated from time-to-time.
You can have iFrame in static HTML page that leads to .php file.
Not really, .html does not mean webpage is static. Ajax can be used to load dynamic data in html page.
Also there is no proper method defined to find whether page is static or dynamic.
One way is, you can check requests in Developer Options of browser.
You can read more here.
No.
There is no guarantee of a direct relationship between a thing that looks like a file extension in a URL and how the server handles things behind the scenes.
It might be resolved using basic static file handling rules to a static file with that name.
It might use a tool like mod_write to map the URL onto a server side script with the same name but a different file extension (e.g. if the site used to be made of static files, but was changed to be dynamic with steps taken to keep the URLs unchanged).
It might use a tool like mod_write to map the URL onto a server side script that has no relation to the name of the file but implements the front controller pattern for the whole site.
It might map onto a server side script which looks at the end of the URL to determine what type of data to return the content in (e.g. cars.html and cards.json might both be be handled by the same script, which outputs a list of cars, but it might output it in JSON or HTML depending on the URL).
It might hit a 404 error or a 302 redirect.
It might do any number of other things.
Not always, sometimes it can be a generated page from a Servlet or a PHP script that generates them. you can have a .htaccess rule to add .html to all documents.

Performance in MVC web application

I am struggling to get some performance in my MVC application.I am loading a partial page (popup) which is taking hardly 500ms. But each time the popup loads it also downloads 2 jQuery files as well.
is it possible to use the jQuery from cache or from parent page?
I have attached the image in red which shows 2 additional request to server.
In order to improve the performance you can try with the following approaches:
see if your application server supports GZip and configure the application/server to return the responses always archived in Gzip
Use minified version of JQuery
there are also Packing libraries where you can pack all the imported resources, such as CSS files and JS files, and the browser will do only 1 request per resource type. For instance, in Java we have a library called packtag.
In general, I recommend you using Google Chrome browser and its performance analyzer. It will give you good hints.
In the Bundle config use this code
BundleTable.EnableOptimizations = true;
and also indclude both files in single bundle.
Does the popup use an iframe or does it's content just get added to the DOM of the current page?
If it gets added to the current page you could try just adding the script references to the parent page instead. It might not always be the best idea if the parent page has no need for those two files, but if the parent page also uses the jQuery validation then the popup will be able to use the parent's reference to the script file.
For an iframe I'd suggest looking at Gzip and minification to make the scripts load faster.

Dump my MVC site to static files

I want to build a simple site with MVC but then render the "pages" and corresponding "assets" (js, css, images, etc) to what one might call a "static site".
In other words, I don't want to deploy to an IIS server that supports MVC. I simply want to build the site in MVC then somehow parse those pages into static html/css/etc files and upload the site to a regular LAMP host.
Is there an easy way to automate this? NuGet package? Binary? MVC extension like maybe a handler add-on that can render out the static site in a single pass?
About 10 years back, I used to download whole websites for offline use using HTTrack Website Copier. May be you could download your own website which gives you nice hierarchy of your static web pages. If you think all your webpages are reachable through the homepage links, menu links etc then you can download most of your website. Basically you can google for web crawlers/ offline browsers/website downloaders etc. and run them to get your job done.
Alternatively if you know the pattern of urls, you could give it to download manager to download them. Not sure if it works with your website, but I do it sometimes.
HTH
If your site depends on a database or some other dynamic source it will be close to impossible to dump all possible combinations of pages into static files. If on the other hand your site is pretty much static, saving the rendered HTML/JS/CSS source into files and uploading it to a LAMP server won't be too hard.
You may wanna look at Pretzel, a .Net static site generator.
Update: Apparently it doesn't work on ASP.Net projects: Issue #123. It only supports Razor language for authoring content pages.
If the reason for doing this is performance related why not just use output caching and the like, that way the pages will be extremely fast (you could set the cache timeout to a very long period of time) and you don't need to run some tool to do the conversion and have to store your html separate to your source code.
Of course you will still need to run IIS/.net
You have three options:
Create your website using plain html, css, jquery and images. You can use Visual Studio Code as IDE to create the files. One issue might be to manage common header/footer for your website. But you can solve it by injecting html header/footer using jquery.
Use a CMS (content management system) like Umbraco to host your static site. Umbraco indexes and caches pages to improve performance. You have great control on what to publish on your website etc.
Create the website using .Net + MVC and use tools like HTTrack to download a static copy of the website. You can even automate the process using commands and triggering it after every deployment or build etc.

Resources