include big static html in jsp Pros and Cons - html

I want to know whether any problem or load on the server when a big static html file is included in JSP.
Whether the server takes load in including the file on startup. I know that server converts and compiles the jsp only once on startup. And the page is rendered directly as servlet whenever user hits it.
I had a debate with my manager on this. Can you please provide me some information on this. I need Pros and Cons by doing this (server load / client load / anything related).

java translates jsp content into a class, which basically acts like this:
JSP file with content such as:
<div>this is regular html</div>
<%
System.out.println("this is code");
%>
is translated into:
out.println("<div>this is regular html</div>");
System.out.println("this is code");
where out is the response output stream.
so all your static content will be translated into such response out function calls, which technically is probably a bit slower than just sending the whole file back in one big chunk.
There's also the possibility of caching on the client side when static content is used, something you can't do when you embed dynamic data in there. You can also serve it from a CDN network instead of serving it directly from your app servers.
And last, you can serve all your static data from a web server and your dynamic data from your app server if this is the way your system is set up, which might make some sense.

Related

Call a node.js function inside an html file

This is most likely a repeated question.
The closest I got to an answer was here: execute a Nodejs script from an html page?
Yet, I still can't understand.
So here's the situation:
I have an express server setup with the following files:
Express App
server.js
index.html
and right now I want the html folder to have a button, that calls a function set in the node.js file.
Tell me if more information is needed, thanks!
EDIT:
Im remaking the question to be more clear.
I am using an express server to present a website, that present a button saying " Power Off", I want this button to be able to execute an action on my server computer, that action being a terminal command to power it off.
I wanted to know how could I make said button, written in HTML, hosted on the server but presented to the client, to interact with the server.js file hosted on the server, which would have a function set to execute said command.
thanks!
You need to understand a little better how the client/server architecture of a web page works and where code actually runs and how the client and server communicate with one another.
You can't call a function directly on your node.js server from an HTML file. The HTML file is in the client's browser. The node server is your web server, far away from the client's browser on different computers. Though it may seem like your HTML is on your node.js server because it's in a directory on that server, that's only where it is stored. When the browser requests that page, your node.js server sends the HTML to the client's browser and it is rendered back in the client browser and that's where the Javascript in that page runs (in the client's browser, far away from your node.js server). This is a client-server architecture. The HTML page is running on the client. The node.js server is on your server - different computers.
If you want to communicate with the node.js server from the web page, then you use Javascript in the HTML page to make an Ajax call from the Javascript in the web page to the node.js server (An Ajax call is an http request). You then configure a route in the node.js server for that specific Ajax call and you can then write code in node.js to do whatever you want to happen when that Ajax call is received. It can carry out some operation on the server, it can retrieve data and return it to the client, etc... You can optionally send data with the Ajax call (either as query parameters for a GET request or as body data for a POST request) and then the server can optionally return data back to you (often as JSON, but it can be any format you like).
I'm not an expert with Node, but I think what's happening here is blurring the lines between server and client. Even though both use JavaScript, there's a distinction. NodeJS could easily be replaced with Ruby, PHP, Java, whatever-backend-language-you-like, and this distinction would apply in the same way it does when you use JavaScript on the server. There's no differerence.
Server-side code executes on the server. Client side code executes on the client (the browser). If you need to call a NodeJS function (assuming it has to interact with the other server side code such as databases etc) then you can send a request, either via AJAX or standard HTTP, to the a route on the server and call that function within the route.
On the other hand, if the function is generic enough and doesn't involve any specific Node code then you can simply add a script tag with your JavaScript file to the index.html page.
There is a difference between server and client. You cannot just call a function on a server from a client directly, there is more to just that. If you wanted to, you could do it by routing a path to wherever and making an HTTP request to that path, or even, using other protocols like WebSocket if you need to communicate both ways.

web app on top of a REST API - how to persist data between page requests?

I'm starting with web development these days and I would prefer so called client side rendering. In practice that ajax request needed data and add them to the html file ( which has already the static content, and dynamic data is added via 2nd request ). I like this approach, cause of a clean seperation between client and server. You just need to define an API and you can seperate the work.
So if you don't create the dynamic content on server side, how dou you persist data between page requests.
For example, you are on a overview for a list of adresses. You can click a button to edit a specific adress with id "25". That will requiere a new html file for that task, which will be loaded and rendered. How does the javascript included in that html file know, which adress should be loaded. How can it access the id "25"?
Approach 1. You don't persist anything on the client and simply reload everything as you go back and forth between the list page and the editor page. Editor page gets the id "25" and loads corresponding item either using AJAX, as you want, or on the server.
Approach 2. You do everything on the same page (SPA). You use JavaScript and probably some framework like Angular to maintain your page state.

Could we pass GET data to css?

I just came across a website pagesource and saw this in the header:
<link href="../css/style.css?V1" rel="stylesheet" type="text/css" />
Could we actually pass GET data to css? I tried searching but found no results apart from using PHP. Could anyone help make meaning of the ?V1 after the .css
I know this forum is for asking programming problems, however I decided to ask this since I have found no results in my searches
First of all, no you can't pass GET parameters to CSS. Sorry. That would have been great though.
As for the example url. It can either be a CSS page generated by any web server (doesn't have to be PHP). In this case the server can serve different pages or versions of the same page which might explain the meaning of V1, Version 1. The server can also dynamically generate the page with a server-side template. This is an example from the Jade documentaion:
http://cssdeck.com/labs/learning-the-jade-templating-engine-syntax
It can also just be used as cache buster, for versioning purposes. Whenever you enter a url the browser will try to fetch it only if it doesn't already have a cached copy which is specific to that URL. If you have made a change in your content (in this instance the css file) and you want the browser to use it and not the cached version you can change the url and trick the browser to think it's a new resource that is not cached, so it'll fetch the new content from the server. V1 can then have a symantic meaning to the developer serving as a note (ie I've changed this file once...twice..etc) but not actually do anything but break the cache. This question addresses cache busting.
There are different concepts.
At first, it only is a link - it has a name, it might have an extension, but this is just a convention for humans, and nothing more than a resource identifier for the server. Once the browser requests it, it becomes a server request for a resource. The server then decides how to handle this request. It might be a simple file it just has to return, it might be a server side script, which has to be executed by a server side scripting interpreter, or basically anything else you can imagine.
Again, do not trick yourself in thinking "this is a CSS file", just because it has a css extension, or is called style.
Whatever runs at the server, and actually answers the request, will return something. And this something then is given a meaning. It might be CSS, it might be HTML, it might be JavaScript, or an image or just a binary download. To help the browser to understand what it is, the server returns a Content-Type header.
If no content type is given, the browser has to guess what it is. Or the nice web author gave a hint on what to expect as response - in this case he gave the hint of text/css. Again, this is how the returned content should be interpreted by the client/browser, not how that content is supposed to created on the server side.
And about the ?V1? This could mean different things. Maybe the user can configure a style (theme) for the website and this method is used to dispatch different styles. Or it can be used for something called "cache busting" (look it up).
You can pass whatever you want; the server decides what to do with the data.
After all, PHP isn't your only option for creating a server. If i wrote a server in Node.js, set up a route for /css/style.css and made it return different things depending on what query was given, neither the server nor browser will bat an eyelid.

in HTML page can we use jsp code

In page.html we can use javascript code, I accept that, but can we use jsp and tld files in html files.
Please explain.
Any server-side code would need to be executed on the server, not in the browser. There's a hard separation between the server-side processing and the client-side processing. So the JSP code wouldn't be able to interact with the JavaScript code or anything like that.
In order for server-side code to be executed in an HTML file before rendering it to the browser, your server would need to be configured to process that code. It would be a matter of configuring your web server, whichever one you're using. By default I imagine it just returns .html files to the browser without any server-side processing. But you can configure your web server to treat .html files just like it would JSP files.
Keep in mind that you would need to treat those .html files like you normally would JSP files. It would have to match the same conventions for separating client-side code from server-side code.
If you configure your web server to map the text/html content type to JSP, you can.
No. JSP pages are executed on the server side and produce HTML, which is sent to the browser. JSP acts just like PHP in this regard, essentially "rendering" some HTML code and sending it off to the user. You can't embed JSP code in the HTML and send it off to the user - their browser will just do nothing with it.

Insert SEO friendly dynamic data into HTML without Javascript

I have some static websites. By static I mean all the pages are simple HTML without JavaScript (all the data are hard-coded).
I have a server side program that creates dynamic data that I'd like to insert into my static sites. By dynamic I mean the data changes very often.
How should I do this?
Here is a scenario: On the server side my program generates the current time-stamp in every millisecond. When a user open one of my static sites the page gets the current time-stamp from the server and render it.
I'd like it to work with search engines, so I can't use JavaScript.
It's not possible to change the HTML structure client side without Javascript, so your solution is to add some handler server side for files with .htm and .html extensions.
About JS: Please note that most spiders (if not all) won't be able to see data rendered by javascript since most of them are analyzing the plain HTML that is returned by the server.