I'm using polymer and firebase to make a web app, and the generated service worker is acting weird.
So, as you can see, the number of "clients" keeps increasing overtime. A new client is added like every 5 seconds.
What is a possible cause of this?
My guess here is that you have a lot of tabs open. I saw that happen to my project when I opened up another tab of the same URL. Or you might be missing some event listeners for the SW.
Related
So this is something I've been racking my brain about a bit, consider the following scenario:
I'm working on my project, I build it, and in my bundle is a lazyloaded module: module-a-[oldhash].js, that will get lazyloaded at some point in time.
Everything is fine and dandy.
I do some more work on my project, create a new bundle, deploy, and now my content hash has changed: module-a-[newhash].js. I deploy, go to my page, my service worker calls skipWaiting, but my page still tries to request module-a-[oldhash].js, which now no longer exists.
How do I go about this? The only way that I can think of handling this, is show an 'update available' message that posts a skipWaiting message to the service worker, and reloads the page on controllerchange event. But I'm curious if theres no way to achieve to same thing without having to include such a notification/toast pattern and a reload.
Additionally, its my understanding that this would only pose a problem with lazyloaded resources
Is my understanding of these problems correct? What are some common patterns for dealing with this?
Pretty much everything you describe there is correct. I'll just point out that this is a problem that extends beyond the use of a service worker. It can easily happen with long-lived single page apps that attempt to lazy-load a URL that has been replaced server-side with a new deployment.
There's some general information about the problem and potential solutions collected on at this Paying Attention while Loading Lazily site and associated video.
In general, the best practice is to:
Always assume that lazy-loading might fail (for whatever reason) and handle those failures gracefully. One approach might be to ask a user to reload the page upon encountering a failure.
Using a cache-first service worker can help protect against lazy-loading failures, at the expense of delaying updates until the newly installed service worker moves from waiting to active. As you mentioned, the best practice tends to be to show something in your UI letting a user know that updates are available, and once they opt-in to accepting those updates, postMessage() to the service worker telling it to call skipWaiting(). And finally, listening for the controllerchange event and calling window.location.reload() when that's fired.
We develop accounting system on a web with ASP.NET MVC and encountered this problem - if user is in the middle of the work and somehow manages to close browser all work is gone (and users are not geeks at all it did happen and will happen). Especially problematic at Chrome in Windows after they removed warning of closing tabs from philosophical reasons so now it will just shut down. We would like to be able to somehow catch this behavior. Also even when Firefox for example has warning that user is going to shut down his tabs - simple clicking the checkbox will remove it all again. So is it possible to keep track of this action to prevent user accidentally closing browser and lost all the work? Or is it even possible to do for example in Chrome? The solution would be simple warning window but it needs to show basically everytime if closing while our web application is alive. We don't want to keep session alive after closing browser for obvious security reasons. Also - it should work at Chrome, IE and Firefox. Thank you for your help.
you can try the below code:
window.onbeforeunload = function()
{
return "Are you sure you want to exit";
}
If your front end is using MVVM such as AngularJS or Knockout, or any of the other popular binding libraries, consider a different approach to preventing the user from quitting the page.
In a client-side interval, serialize your view model and store it in local storage.
When the save/exit condition for the current page is met, clear the local storage.
If the page is loaded again, and there is something in local storage, this means that on the previous session, the browser was closed before saving - so deserialize the local storage object back into the viewmodel (use a unique key per page) - you can combine this with some UI that tells the user that their previous state has been restored, click ok to continue or start over to start again (which would reset the viewmodel)
I should add that you'll have to watch out for multiple simultaneous tabs, so you may want to work around this by making the key unique somehow, e.g. creating two invoices simultaneously.
This essentially provides an auto-save but client-side only.
You can combine this technique with using window.onBeforeUnload as per Tejinder's answer, but as you cannot style the "unload confirmation" prompt, providing an auto-resume is a much better experience.
Is there a limit on number of open tabs for an ASP.NET MVC application to be able to make another request? Why I'm asking this is because, I make some requests in a blank target and after having 5 open tabs, I am not able to invoke any action method unless I close one of those 5. To make sure it's not related to anything that deals with database stuff, I put a breakpoint to the first line of the desired action method. The first 5 requests go super fast. But the sixth one.. The breakpoint doesn't hit on the sixth request. It's only after I close any of the previously opened tabs that the breakpoint hits immediately.
To be honest, I'm not sure if this is even related to ASP.NET MVC, because I have this problem in Chrome and Firefox. With IE10, there's no such problem. Do you have any idea what the problem is?
I'm both glad and sad to have found the reason behind this weird behavior. I use SignalR for realtime notifications. As browsers have maximum number of concurrent connections, which is something around 6, I am not able to open an additional tab that has SignalR connection started. So this is a browser limitation. There are workarounds though. One of them is adopting subdomain approach like facebook does.
Another one is limiting the number of open connections as described in this blogpost
I use SignalR to show new mail notifications dynamically. I've recently realized that if there are multiple tabs for the same domain, then the concerned function gets called as many times as the number of the tabs. So for instance, I open the application in IE and login as Brian. Then I open the same application in Chrome in 3 tabs and login as Kevin. When Brian sends mail to Kevin, the script that is responsible for incrementing the number of new mails is called 3 times.
Has anyone come up with a solution for this?
Each tab is considered a separate connection for SignalR and hence you get multiple messages.
You can take inspiration from this.
For more details visit follow another SO question Javascript; communication between tabs/windows with same origin
So after two days of googling incessantly and apparently asking the wrong questions, I think I have figured out a way to word it so I get the response I'm looking for.
I have a Project Management application, written in MVC3. Sometimes, the users have to attach large files and upload them to the applications. (100-200 mb) is typical. The problem of course is that this is currently handled synchronously, and varying network speeds mean that the application can be completely blocked for 10 minutes to an hour if someone's on a slow connection. FTP is NOT an option here (my hands are tied by our network guys on that one).
So I am looking for a way to do the following workflow:
user clicks Upload File
user selects File to upload
user clicks "Go" or whatever button
Application says "your file is being uploaded. You will be notified when it's complete"
user continues to use the application as normal.
Some things to be aware of: I already have an internal messaging system implemented. So when I say that the app will notify the user when it's complete - all it needs to do is insert a new message into the queue. It DOES NOT need to notify the user's current screen or anything like that - so I'm not worried about a return value of any kind. I also have a background Error log implemented, so I can insert a message into the log if something goes wrong and again - inform the user via the internal messaging system.
So I am stumped on how to implement this. I thought an Async Controller was the right way to go, but if I understand all the stuff I've been seeing - it's not. Feel free to correct me. I implemented a version using Async but when addressing the one problem it had, I was informed that I was doing it wrong anyway.
So uh...help? I'm all ears.
If you can use 3rd party controls then take a look at the Telerik controls:
http://www.telerik.com/products/aspnet-mvc/upload.aspx
It has an Asynchronous File Upload control.