Saturday, February 20, 2016

Where browser meet ADF : Running page only with f:view tag

Hi Everyone,

I am writing this post to start something different way to understand ADF.

As you all know ADF is mature ,strong and smart framework. It is build on java and java itself is very robust language.However in software industry there are always some thing extra to do.It is how software work.Innovation and development happen at the same time.Oracle Application development framework was evolving , now evolving and will evolve.

There are a lot of website , video , books and blogs are present which explain ADF from basic to advance and also oracle community make developer life easier. Being a developer these all information are very useful and everyone should use.

Being a blogger (however i am less active) it is my responsibility to post/share new, different and hidden knowledge which i learn while performing my job.

The main reason for writing this post is to clear my intention for my up coming post. ADF is nothing but client server architecture based framework. As client i should not know complexity of server. As a client i should only know about browser. Browser treat all the application as same. Browser only know HTML ,CSS and Java Script. As developer we always try to understand framework as a developer point of view not browser point of view.

Going forward i will try to mitigate gap between Client and Server.This will what different then other blog (at least i am hoping this :) ). My plan is to explain whole process/understanding of ADF which include server response , html code , css code and their relation.

I will be using Jdveloper 12.2.1.0 and if required oracle XE as a database.As starting topic will be very easy and simple and i am sure as i go more complexity will come.

In today post i just created one application and inside that i have created one page which has below code which basically minimum code to run page. (i removed default tags which jdeveloper add automatically).


Above code just a starting point , now let see what browser is thinking about above ADF code and     how it is understanding.


Above is browser code. i am using chrome browser and i am inspecting page using chrome  development option. In Elements tag we can see html code and here html code is very minimal. This HTML code is not coming from server . ADF page is not returning any code at all. So why element code is showing above code ?. For understanding purpose i have created a blank page html page and i ran and i see same thing. I think it is browser which is show this code. The point is f:view is not generating this html code as a response.

They are a lot of thing to tell but let us try to understand request and response which we can see via Network tab of development tool.




 Under name column it has two value so it is basically two request. However as user i had just initiated only one request but if we see this it's look like someone is initiating another request. We can see this in browser itself.



So if i try to understand individual column then i can see initiator column will tell me who is  initiating request. The first one is clear it's is by me , so let see second . It look like there is client side script which is initiating second request. And also it look familiar since it has AdfLoopbackUtils name. So second request was initiated by java script function AdfLoopbackUtils.runLoopback .

I search on google i found below document from oracle.

https://docs.oracle.com/middleware/1212/adf/AFCJS/oracle/adfinternal/view/js/util/AdfLoopbackUtils.html

One thing i observer that if i put af:document component it is not generating look back script.
I am stopping here in next post i will explain why look back java script involve and who is involving this.

Thanks,
Prateek