Since Jboss supports Servlet 3.0, servlets can serve in an asynch manner. However, how do i configure jboss or application so that static resources like javascript files, css files and images can be served in an asynchronous manner?
Following link doesn't help either
https://docs.jboss.org/jbossweb/7.0.x/aio.html
Has anyone done this before?
As far as I know and from everything that I have read, Asynchronous support in Servlet 3 does NOT serve web resources. It is used for asynchronously handling HttpServlet Requests and Responses so that your AJAX doesn't get hung up waiting for database connection pooling and the like.
How to asynchronously serve JavaScript and CSS
It is import to place all of your <script> tags/calls at the end of the <body>, right before the </body>. This ensure that your HTML gets loaded before any fetching or running of the scripts happen.
The simplest way to serve JavaScript asynchronously is to use HTML5 and add the 'async' attribute. NOTE: this may only be used for linking JavaScript code with the src attribute, it will not work for JavaScript in the <script> tag.
<script async src="../js/your-javascript-code.js"></script>
If you can not use HTML5 or the async attribute is not supported, you can do the following taken from Thinking Async:
(function(d, t) {
var g = d.createElement(t),
s = d.getElementsByTagName(t)[0];
g.src = '//third-party.com/resource.js';
s.parentNode.insertBefore(g, s);
}(document, 'script'));
How to asynchronously load CSS using jQuery?
Dynamically loading css file using javascript with callback without jQuery
How to load CSS asynchronously without using JavaScript?
In case you are interested, here is working example of how to use the Servlet 3 asynchronous feature, demonstrating it's intended use, running on JBoss.
Related
A) <script src="https://apis.google.com/js/api:client.js"></script>
versus
B) <script src="https://apis.google.com/js/client.js"></script>
The only differnence being the api: before client.js.
CDN A is used in the Google Sign-In for Websites docs in the Building a button with a custom graphic section.
CDN B is used almost in the Google API Client Library for JavaScript (Beta) docs.
They both appear to work interchangeably.
Short answer: there is no difference
Long answer:
The Google JS client CDN is a bit weird because the actual JS you get is dynamically created based on the file name you provide.
You can load multiple components of the library by constructing the URL as module1:module2:module3.js
api is the core part and is always loaded even if you don't add it to the list of modules, because it handles loading the other modules.
Theoretically you could just include api.js and then dynamically load extra modules by calling gapi.load("module", callback) which is exactly what happens when you load api:client.js or just client.js
If for example you would want to use the API Client Library together with the new sign-in methods you could include api:client:auth2.js or client:auth2.js.
And for extra confusion you could even include https://apis.google.com/js/.js which is the same as https://apis.google.com/js/api.js
Use links only from the documentation!
Simple to check this:
1) Add to header of your page this script:
<script src="https://apis.google.com/js/client.js"></script>
Open DevTools -> Network
I see:
2) Change link to other script
<script src="https://apis.google.com/js/api.js"></script>
Open DevTools -> Network
I see:
api.js is the core, when client.js is the module.
Here a completely different content: https://apis.google.com/js/platform.js
I'm Trying to make a simple web browser in node-webkit, to polyfill features that Chromium doesn't support yet (time element, etc). I have had success in listening for the iframe.onload event and then appending a script tag with the polyfills, but this still means that features that I've polyfilled won't be detected by Modernizr or other feature detention.
I've tried loading the page using the http node module, appending a script tag and then turning the page source into a data URI for the frame but data uris essentially turn external pages into static html with no scripting, which renders many web pages unusable.
Also, loading a page through node's http module is proving extremely slow compared to loading through an iframe.
So, is there any other way? Ideally I run a script in the iframe before any other scripts are run.
Yes, I am using nwfaketop and nwdisable on the iframe.
The 'document-start' event should be helpful. See https://github.com/rogerwang/node-webkit/wiki/Window#document-start
See also Window.eval() in https://github.com/rogerwang/node-webkit/wiki/Window#windowevalframe-script
My app is using a SignalR 1.1.2 on ASP.NET MVC
It has the following call in the View
This uses the auto-generated hub.
At this point all client and server side methods are done.
Can I get a copy of the 'hubs.js' file I get when I paste this
link into the browser.
I want to add a new javascript file to the BundleConfig.cs so I
can minify this file and try and improve the performance of my app.
Hope someone can advise, I have done it and it seems to work, I just
want to be sure that I will not loose the ability to shift gears to
websockets, SSE, Forever-Frame depending on what the client and server
can negotiate.
MVC web optimization does not support dynamic scripts. I did it like this in my last project, it doesnt help with minifying but you can add the static script to the bundle config
(function ($) {
var dynamicScripts = ["signalr/hubs", "eventAggregation/events"];
$.each(dynamicScripts, function () {
$.ajax({
url: this,
cache: true,
dataType: "script",
async: false
});
});
} (jQuery));
if you navigate to the /signalr/hubs uri you can save this javascript file and put it in a bundle. Of course if you change anything to do with signalr then it might not work. But this is for release. Just a note that this 1.1.2
For maintainability reasons, I want to database drive my javascript, in that I only want to send the javascript which is needed based on the users options.
So, is it faster/less resource heavy to have links in the database pointing to javascript files, then using response.writefile to embed those files into the clientside page, or is it faster/less resource heavy to stick the javascript script straight into the database, and response.write it onto the screen as and when needed?
So, is it faster/less resource heavy to have links in the database pointing to javascript files
Usually yes.
External Javascript files can be cached by the browser, and will be loaded only once. Javascript code injected into the HTML page needs to be loaded every time, which increases bandwidth and loading times.
Also, having JavaScript code in a static file (instead of a dynamic one that fetches the code from the database on every request) is bound to be the fastest and least resource-intensive solution.
Don't use Response.Write.
Be aware that if you send the entire JS file once, the client will / should cache it so it doesn't have to be sent again.
DB lookups for every page just to get the relevant JS will be slow.
By only sending the links to the javascript to the client a seperate HTTP request will have to be created in order to go and get each file.
If you embed only the required javascript directly into the page when needed this prevents this. Look at jQuery, thats got a load of javascript available to the client that isn't being used.
Less HTTP requests generally results in a faster website so I would go with embedding the code directly.
Edit:
I disagree with the caching answers above. If you ensure only the smallest amount of javascript that is required is embedded then my answer should be faster. This page will be cached too!
Here is my desired flow:
A static web page (html) uses XHR calls to an ASP.NET page
The .NET page retrieves information from a remote server using web services
The .NET page returns an HTML "snippet" that is inserted into the static HTML page
I'm getting hung up on how to deal with the HTML snippet generation on the .NET (2.0) page. I've thought about something like this in a generic .ashx page:
public void ProcessRequest (HttpContext context)
{
context.Response.Write("<ul>");
//assume "people" is a list of data coming from the external web service
foreach (string person in people)
{
context.Response.Write("<li>" + person + "</li>");
}
context.Response.Write("</ul>");
}
It just seems a big "ugly". Has anyone done this another - and possibly more efficient/elegant - way? Any help would be appreciated.
Returning html for this task is a bit weird, IMO. In most times I prefer the following way. Open your web service to public or add a wrapper to it and just use it directly from js of your static page. The service should return json (preferable) or xml data. On the client side format (print in html as you want) received data using js in callback to the XHR and inject anywhere you want.
But also I want to cast YAGNI on this task - if it'll be used only several times and in a few pages, use the most fastest way to implement it. But if you are building some RIA application I recommend you to check ExtJS javascript library.
Edit 26/02:
If you can't use ASP.NET MVC but wanna to use some good framework instead of "Response.Write" stuff please check OpenRasta. It's one of my favorite web frameworks. It works fine on .Net 2.0 and it's very flexible and powerful. And also it has a great community.