Google chrome: React Page does not open in google Chrome Browser - reactjs

I open a React page in Google chrome but does not open, still loading and Browser show Aw, snap! Can you suggest me What going Wrong.
Image

The Aww Snap crush is a bug in chromium caused by different things:
Low memory
It is also possible that site contains lots of images or JavaScript which might force Chrome to run out of space on the device while loading the site.
I'd suggest you clear up some space on the device and reboot the device.
If it helps, try closing any unused application in background to save resources (CPU, RAM and disk space) and see if Chrome continues to crash.
This vulnerability crashes browser tabs when encountering a link with a malformed URL in the HTML of a page.
The bug crashes the browser without the user taking any direct action other than loading the affected page.
This vulnerability occurs because of Chrome's habit of prefetching page data, such as performing DNS lookups on domain names in links on a page, in a preemptive attempt to speed up future loads. Chrome will try and work out which link on a site you're likely to click on next and then pre-load in the background.
Possible fix is disabling pre-fetching
Go to Settings >> Privacy >> Use a prediction service to load pages more quickly >> Uncheck box.
Another possible cause is a corrupt profile.
You can create a new profile, but if you do, custom data won't be available by default. This includes bookmarks, extensions and settings that you may have changed in Chrome.

Related

How to disable Cache in Firefox for the localhost:3000

I have a little problem I'm working on a react app using the localhost:3000 to see the differences. But for some of the changes like the favicon, it didn't update until I clear the cache for this url in firefox. So my question is there is a way to stop firefox from saving the cache for this specific url without disabling it completely for every website?
You can disable cache temporarily by opening developer tools, press F1 to open dev tool settings, scroll down and enable Disable HTTP Cache (when toolbox is open), however this will only take effect when dev tools is open

Google cloud is caching my static files

Google cloud seems to be caching my static files hence my changes in CSS are not being reflected. How do I go about this.
Note: it's just a simple static site
Its browser issue so please clear your cache
to clear the browser cache in google chorme browser to follow this steps :
On your computer, open Chrome.
At the top right, click More More.
Click More tools and then Clear browsing data.
At the top, choose a time range. To delete everything, select All
time.
Next to "Cookies and other site data" and "Cached images and files,"
check the boxes
Click Clear data.
The issue was from the browser. I cleared the cache and everything works fine

How to reload "index.html" in angularJS without manual intervention?

I have a website developed in AngularJS, and index.html serves the root of the application.
All the JS and CSS versions are maintained in the index.html itself, which means for any changes to reflect to the user, "index.html" is to be reloaded at the browser.(correct me if I am wrong here).
This is a problem, since there could be chances that the user has a tab opened of our website in his browser and we have published a new release. This release will not be published at user's browser till the time a "Manual refresh" is not triggered and "index.html" is not reloaded and hence bring up the possibility that the user will not be using our latest release.
We have written a framework to reload all resources once a release is detected by sending the latest version from web-server and comparing this with the current version in the browser and trigger a reload automatically. This fix works fine, but the problem again is, how to publish this release first time to all user's browser?
I hope you get my problem? let me know otherwise.
This is not possible. There is no way to force an open page to refresh if it does not already have code to implement that feature. You will have to wait until the user refreshes it themselves, and the browser cache expires, and any intermediate caches between the user and your servers.
I recommend searching to learn about "HTTP caching" if you are not already familiar, as well as "cache busting." In general, you may want to consider making index.html a small file that references your big files in <script> tags, setting the cache control for index.html very low, and use cache busting techniques on your big files.
But for your first release, there is no way to invalidate open tabs or existing caches. If this will cause a problem with your server, read up on "API versioning" for different ways to handle it.

How to load data at launching Chrome App?

What's the best practice of loading data at launching Chrome App?
The landing page of my Chrome App is dependent on some configuration data, which I've stored in the chrome local storage. However, reading chrome local storage is an asynchronous process. Hence, after the App has launched, there is a period of time when the landing page doesn't show correctly.
To avoid this blank time (due to the asynchronous process of reading local storage), I'm thinking about reading data at background JS. However, I haven't googled out what's the best practice to do it.
Anybody has any comments? Thanks.
just listen to the onLaunched event
chrome.app.runtime.onLaunched.addListener(function() {
// load your data
});
Here's one piece of helpful suggestion I've got from the Google Group. Share here so that someone with the same problem might refer to it:
You can read from chrome.storage in the background page and open the window when the data is ready. However, the user experience might be even worse, because instead of the incorrect landing page, you have no user feedback at all.
The usual (and easy to implement) solution is to show your landing page with some visual feedback during data loading, like a spinning wheel with a "Loading" label. If you UI really requires the data to show up, you can add this visual indicator as an opaque div on top of the whole window.
Some people use splash screens, but I don't think it adds to the user experience.

Can't exit Salesforce Development Mode

When I have the Development mode enabled for my profile, and I open a custom VisualForce page, the code-editing window/frame appears on the bottom of the screen.
Problem: for 7-8 months now, this window does not disappear when I am done with the custom VF page and go on to strandard pages. It's just sitting there, and displays the code for the original VF page. In addition to that, it's keeping the custom VF's URL up in the address bar of the browser, which interferes with other VF pages which take a use of the URL data.
I have submitted this as an issue to SF Support, who had pounded on it for months, and did not resolve.
Have you experienced this problem before, or know how to fix?
I've had this problem before and found the Development Mode toolbar at the bottom of pages particularly annoying. It doesn't work with some of the Firefox plugins that I use. So, I turned it off.
To edit a page without Development Mode turned on, go to Setup > Develop > Pages (or Apex Classes for controllers).
If you'd rather keep Development Mode on you may want to try updating your browser, or try using a different browser (Internet Explorer, Firefox, Chrome).
You can also use the url parameter
core.apexpages.devmode.url=1
in the address of any VF page to temporarily disable the development Mode toolbar.

Resources