Traditonal webpage vs Modern webpage working

-

                                       
  • "You are the user, visiting the webpage and when you do visit the webpage you use a client browser for that  !!!"
                               To be precise when you initially visit the webpage a request is sent to the server(to the computer on the internet where the webpage (html file is hosted)and that Server then loads that webpage and send its back to your Browser , so-called response is the most basic thing you see on internet.

                     Complexity that gave a birth to a JavaScript     


  • Let say a user visits a online shopping site that user had previously requested, the user clicks a button to submit the form (for eg : to order some product )that will triger new request sent by browser to the server to send this form. Same way the Server  will handles the incoming request (may be store some ordered products in the database), and soon reply with new Html page as a new response !!!

                "you might get confuse here so what is the complexity you are talking about then?"      NOW, the concept of javascript  comes here but how ??    How about  skipping second request because each time you request a something in browser it takes a round trip  , generating new response every time then and again.   why not to show info at the same page , overlay to the existing page ??    


            Again the question is how ??

"let uses javascript features such as modal as it called pop up like window which gets loaded on existing page so that we don't need to fetch the new html page and break user experience of it but instead that we stay on same page and tweak a little bit "

    "THIS IS WHERE JAVASCRIPT CAN HELP US AND THE REASON OF INVENTION OF JAVASCRIPT that works with modern browser"




    

Comments

Post a Comment

Popular posts from this blog

JavaScript — Double Equals vs. Triple Equals - weird things on JavaScript

-
The Problem JavaScript has two  visually  similar, yet  very different , ways to test equality. You can test equality with  ==  or  === . Here are the differences: Triple Equals When using triple equals  ===  in JavaScript, we are testing for  strict  equality. This means both the  type  and the  value  we are comparing have to be the same. Lets look at a couple examples of strict equality. In this first example we’re comparing the  number  5 with the  number  5. As expected,  true  is returned. Both are  numbers , and both share the same  value  of 5. 5 === 5 // true With this in mind, we can look at two more examples that will return  true : 'hello world' === 'hello world' // true (Both Strings , equal values ) true === true // true (Both Booleans , equal values ) Awesome. Now lets take a look at some examples that will return  false : In this example we’ll comp...
Read more

06_Understanding Execution Context and Execution Stack in Javascript

-
Image
Let look inside js engine the things that execute our code and in the end ,it is all about our memory management and execution steps. For this we have two important concept: The heap memory is our long term memory , it is all about memory allocation , stores data in your system and manages access to it. " i mean browser does that , browser manages heap things, browser taps into our system memory and of course   OS , it allocates memory to the browser app. There the data gets stored which we work in our program and most importantly long term data. There is then Stack thing , is end important for execution of code. Stack is kind of short term memory means Stack control over which function is currently executing.                 "  Heap memory  is used by all the parts of the application whereas  stack memory  is used only by one thread of execution. Whenever an object is created, it's always stored  in...
Read more

Creating and inserting element- part-2

-
createElement() : creating a new array and appending to end of node  <! DOCTYPE html> < html lang = "en" > < head > < meta charset = "UTF-8" > < meta name = "viewport" content = "width=device-width, initial-scale=1.0" > < meta http-equiv = "X-UA-Compatible" content = "ie=edge" > < title > Arrays & Iterables </ title > < script src = "app.js" defer></ script > </ head > < body > < ul > < li > Item 1 </ li > < li > Item 2 </ li > < li > Item 4 </ li > < li > Item 3 </ li > </ ul > < script > const list = document . querySelector ( 'ul' ) const newLi = document . createElement ( 'li' ) // it just create a <Li> element // but still not attache...
Read more