I downloaded a website and I am going to work with offline. But I want it to be like as on the server. I mean the load time. While I am working on offline all items load very quickly. I want make it like on the image.
what can i add to html css javascript files. is there a sleep() or wait() function that i can use?
Do not do that, as it will require great effort with questionable result. If you want to measure performance, the only correct way is to do it on server.
As javascript isn't multithreaded, you can't make the website to stop everything and wait but what you can do is, create a function for your own:
function sleep(delayTime) {
var start = new Date().getTime();
while (new Date().getTime() < start + delay){
// do nothing
}
}
Call this function wherever you want with a number representing the delay that you want.
Related
I was trying to make a function, which compares 2 dates, run every 100ms. Since it is kinda bad to run it in the same thread, i wanted to make it run in a second thread so i can do other stuff at the same time. I am using node v16.7.0 btw.
function dateCompare(d1, d2){
if(d1 <= d2){
// Do some json config editing, already got that down dont worry
}
}
I want to make this function run aside of the other code that i have below that (its listening for events if you are curious).
Thanks in advance!
setInterval doesn't block the main JS thread while waiting, nor does setTimeout
I am trying to solve this issue and can’t seem to find any answers on the web or anywhere. The task is simple. I am using console in Chrome and I am trying to execute Javascript code that will execute the code between pages. As a simple example trying to navigate and pause between pages seems like impossible task.
var increment = 1;
var miliseconds = 2500;
setTimeout(function () {window.open('www.google.com', '_self');}, miliseconds * increment);increment++;
// Do something or grab values on this page
setTimeout(function () {window.open('www.yahoo.com', '_self');}, miliseconds * increment);increment++;
// Do something or grab values on this page
setTimeout(function () {window.open('www.cnn.com', '_self');}, miliseconds * increment);increment++;
Tried event listeners and no luck. Any help?
Unfortunately this is not possible. The console's environment will clear every time you navigate. The most you can do is preserve logs, but that will not allow you to continue executing JS defined on the previous page.
The only way I know of to persist values accross pages is to use the window.name variable which will remain accross different pages, but this is pretty hacky.
If you're looking for something a bit more permanent, I would recommend writing a chrome plugin instead.
Let's say I have this javascript function:
function pauseComp(ms) {
var date = new Date();
var curDate = null;
do { curDate = new Date(); }
while(curDate-date < ms);
}
and a css3 animation (for instance, <i class="icon-spinner icon-spin"></i> from the new font-awesome 3). When I run the javascript function above, it stops the spinner while the function is running. See what I'm talking about here. Basically, javascript stops css animations, and I'm wondering why, or if anyone else has noticed this/found a workaround. I've tried putting it in a setTimeout(fn,0), where fn is the long process, but then realized why that will also not work (js is not multithreaded). Anyone seen this happening?
Update: Interestingly, it looks like this isn't as much of a problem in Safari, although interaction with the browser interface is still being affected.
A browser page is single threaded. Updating the UI happens on the same thread as your javascript program. Which also means that any animation will not draw new frames while Javascript code is being executed. Typically, this is no big deal because most JS code is executed very quickly, faster than a single animation frame.
So the best advice is simply this: Don't do that. Don't lock up the JS engine for that long. Figure out a cleaner way to do it.
However, if you must, there is a way. You can get an additional thread via HTML5's Web Workers API. This isn't supported in older browsers, but it will allow you to run some long running CPU sucking code away from the main webpage and in it's own thread, and then have it post back some result to your page when it's done.
I'm having some trouble calling PHP scripts from Javascript without leaving the current HTML page (if it is at all possible). I understand it is possible using AJAX, although is it possible using Javascript alone?
Context:-
I want my page to perform a short animation using Javascript (using onclick), then immediately call a PHP script to insert data into a MySQL database - all without leaving the page so it does not inhibit the animation.
The animation part I can do and the inserting the data into the database, etc. but how can I call a PHP script at the end of that Javascript animation function?
Any pointers, code fragments, etc. would be greatly appreciated! ^_^
Apologies if this question has been asked previous.
AJAX is Asynchronous Javascript And XML,
Its a Javascript technology that allows you to send a request to the server (as your browser does when you enter a URL) and have the response in a javascript string instead of rendering it in the page.
The problem is different browsers do not implement AJAX the same way, So I suggest using jQuery for abstraction.
do this with jQuery:
<script>
$.get("backend.php",{param:value},callbackFunction);
callbackFunction(data)
{
alert(data);
}
</script>
Just happened to have the same issue, so I came up with something like that. All you have to do is add the code you need, and assign the do_the_script function to the onclick event.
<script type="text/javascript">
var myIntv;
function do_the_script() {
// play animation ...
var address='fancy_script.php';
var tmp = new XMLHttpRequest();
myIntv=setInterval(function(){
tmp.addEventListener("load", doneHandler, false);
tmp.open("POST", address);
tmp.send(null);
}, 1000);
}
function doneHandler(event) {
// maybe do something when script is executed
clearInterval(myIntv);
}
</script>
As you may have noticed, the code that "calls" the address is executed every 1 second. This, is to ensure that the call is made enough times so as to get a single positive answer, call the doneHandler and clear the interval afterwards. If you believe that your server can respond faster or slower you should change those milliseconds accordingly.
you can use jquery ajax:
http://api.jquery.com/jQuery.ajax/
PHP is a server-side language.
JavaScript is a client-side language.
If you want to execute server-side code, you don't have the choice to do a round-trip to the server. If you don't want to leave the page, your only option is doing an asynchronous request (aka AJAX).
Using a JavaScript library such as jQuery or MooTools greatly simplifies that kind of task. For example, you could use MooTools to do a request at the end of your script as such:
var req = new Request({url: '/backend/doPHPInsert.php'});
req.send();
There are ways to do so without AJAX by, for example, creating an iFrame dynamically (or any other element that fetches a resource).
I understand it is possible using AJAX, although is it possible using Javascript alone?
If you don't want to use XHR, you could use this ugly hack...
var request = 'mysql-insert.php',
image = new Image();
image.onload = function() {
// Success
}
image.onerror = function() {
// Error
}
image.src = request;
Except that was only really used before widespread use of AJAX (or needing to make a cross domain request).
I would just use AJAX. jQuery provides some great abstractions for working with XHR.
If you do not want to include the jquery library you can simple do the following
a) ad an iframe, size 0px so it is not visible, href is blank
b) execute this within your js code function
window.frames['iframename'].location.replace('http://....your . php');
This will execute the php script and you can for example make a database update...
This has some good examples for using unadulterated XMLHttpRequest: https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/Using_XMLHttpRequest
(Particularly, scroll down to the asynchronous examples - now you're cooking with gas.)
Edit: see also http://msdn.microsoft.com/en-us/library/ms535874%28v=vs.85%29.aspx which has examples for dealing with versions of IE which don't have native window.XMLHttpRequest.
Now, let's be frank - yes, working with XHR itself (especially cross-browser) is kind of obtuse. You can use just about anything out there (jQuery, Dojo, MooTools, Prototype, Closure, YUI, etc.) to do XHR more easily, because all of them, among other things, give you more concise XHR facilities.
It's still good to know what you're working with under the surface before you start letting a library do it for you though. :)
I am creating a really big JavaScript object on page load. I am getting no error on firefox but on Internet Explorer I am getting an error saying:
Stop running this script ?
A script on this page is causing your web browser to run slowly. If it continues to run, your computer might become unresponsive.
Is there any size limit for Javascript objects in Internet Explorer ? Any other solutions but not dividing the object?
The key to the message your receiving is the "run slowly" part, which relates to time. So, your issue is not object size, but the time taken to construct the object.
To refine things even further, the issue is not the time taken to construct the object either. Rather, IE counts the number of javascript statements it executes, resetting this count when it executes an event handler or a setTimeout function.
So, you can prevent this problem by splitting your code into multiple pieces that run inside calls to setTimeout(...);
Here's an example that may push you in the right direction:
var finish = function(data) {
// Do something with the data after it's been created
};
var data = [];
var index = 0;
var loop;
loop = function() {
if (++index < 1000000) {
data[index] = index;
setTimeout(loop, 0);
} else {
setTimeout(function(){ finish(data); }, 0);
}
}
setTimeout(loop, 0);
The resources available to JavaScript are limited by the resources on the client computer.
It seems that your script is using too much processing time while creating that object, and the 'stop script' mechanism is kicking in to save your browser from hanging.
The reason why this happens on Internet Explorer and not on Firefox is probably because the JavaScript engine in Firefox is more efficient, so it does not exceed the threshold for the 'stop script' to get triggered.
that is not because of the size but because of the big quantity of loops you are executing and the big execution time. if you cut it into smaller parts it should work ok.
Try lowering the complexity of functions your running. Can you post it so that we can look at the loops and try to help?
Edit:
I supose you want to do all that on the client side for some reason. The code seems to need to much execution to be runing on the client side.
Can't you do the calculations on the server side? If this is all to initialize the object, you can cache it to avoid reprocessing and just send a generated json to the javascript side.
It does seem cachable
You must be using big loops or some recursive logic in the code. It really doesn't depend on the size of the object—it depends on the CPU resources it uses (memory, processor, etc.).