Sunday, March 12, 2023
HomeJavascriptChecking Out The Turbo Drive Navigating Development Bar In Lucee CFML

Checking Out The Turbo Drive Navigating Development Bar In Lucee CFML

When you make it possible for Turbo Drive in a Hotwire application, Turbo Drive obstructs indigenous web link clicks as well as develop entries and after that re-implements them utilizing the internet browser’s bring() API. If a bring() phone call takes longer than 500ms to finish (a configurable default), Hotwire will certainly provide a progression bar on top of the home window. The progression bar is a basic << div>> aspect that can be gently styled utilizing CSS. I simply wished to take a glimpse at just how the progression bar operates in a ColdFusion application.

Sight this code in my ColdFusion + Hotwire Demos task on GitHub

To evaluate Hotwire’s progression bar capability, I developed a tiny ColdFusion application with 3 web pages:

  • index.cfm – tons promptly.
  • products.cfm – rests in between 1-5 secs prior to making.
  • about.cfm rests 25-seconds prior to making.

These web pages – as well as their ingrained rest() regulates – offer me sufficient time to check out the DOM (Record Item Version) while the progression bar is being made. Below’s my about.cfm web page, which does one of the most resting:

<< cfscript>>.

rest( 25000 );// 25-seconds.

<. << cfmodule design template="./ tags/page. cfm">
<> < cfoutput>>.

<< h1>>.
ColdFusion + Hotwire Navigating Development Bar Trial.
<. << p>>.
<< a href="">> Residence< -. << a href=" products.htm">> Products< -. << a href=" about.htm"><> < solid>> Regarding< . <


Most Popular

Recent Comments