Go Premium for a chance to win a PS4. Enter to Win

x
?
Solved

"Don't refresh page until fully rendered" in Firefox/Chrome

Posted on 2014-04-21
5
Medium Priority
?
546 Views
Last Modified: 2014-04-30
Hello. I have a web design annoyance. With my workflow, I modify a web page, upload it with the click of a button (to a remote "preview" server), and then "refresh" the page in my browser to see the difference. I often need to see extremely subtle tweaks, like a pic moving 2 pixels, etc.

But when I do this, instead of an instantaneous refresh, the browser gives me a BLANK SCREEN for a .5 - 1 second, as it reloads and re-renders the new page. My mind cannot memorize what the old page looked like, not in detail. To make a good comparison, the page would have to switch instantaneously, or much faster.

So, does anyone know of an add-on, or a method, for Firefox or Chrome, which will do this? I guess it would "hold the old page on the screen until the moment the new page is rendered".

Thanks.
-Soy
0
Comment
Question by:soyproduct
5 Comments
 
LVL 5

Expert Comment

by:Pasha Kravtsov
ID: 40013363
I have two suggestions.
1. SS the before and after and put them into paint and do a side by side comparison.
2. Use a different browser? Not sure what web browser you're using but try firefox or chrome
0
 
LVL 35

Accepted Solution

by:
Dan Craciun earned 1000 total points
ID: 40013375
If you only do HTML/CSS modifications, then Brackets might be interesting in your workflow. It has the ability to see in real time any changes you do to the source.

Another interesting tool is Devtools Autosave, which allows you to save any changes you do using the inspect panel in Chrome.

Finally, if you cannot use these, a clipboard manager that can store photos might be useful. Take a screenshot, wait till the page reloads, take another screenshot and then compare.

HTH,
Dan
0
 
LVL 84

Assisted Solution

by:Dave Baldwin
Dave Baldwin earned 1000 total points
ID: 40013434
I don't think any browser can do that because it takes time to load the new page.  It is much quicker if you preview the pages on your own computer because that minimizes the 'round-trip' delay.  I usually save the old version under a slightly different name and then modify the current version.  If you open the two in different tabs, you can switch fairly quickly between the two.  But it still won't necessarily be 'instantaneous'.
0
 

Author Closing Comment

by:soyproduct
ID: 40033131
Thanks!
0
 
LVL 35

Expert Comment

by:Dan Craciun
ID: 40033141
You're welcome. Glad I could help!
0

Featured Post

VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Ever visit a website where you spotted a really cool looking Font, yet couldn't figure out which font family it belonged to, or how to get a copy of it for your own use? This article explains the process of doing exactly that, as well as showing how…
Q&A with Course Creator, Mark Lassoff, on the importance of HTML5 in the career of a modern-day developer.
This tutorial demonstrates how to identify and create boundary or building outlines in Google Maps. In this example, I outline the boundaries of an enclosed skatepark within a community park.  Login to your Google Account, then  Google for "Google M…
The viewer will learn how to look for a specific file type in a local or remote server directory using PHP.
Suggested Courses

916 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question