Ajax response rendering issue due to pagespeed - angularjs

I am using angular js for ajax call back and later rendering the response to
View.Sometimes the response not rendering to view and it is reflecting after
page load only which is not my desire scenario.
As per my current observations, we have enabled pagespeed in our NGINX server
and may be that is the case why it fails sometime to render the correct data.
Can anyone please suggest if any option available to disable page speed in
ajaxcallback or if any other solution is there that would be greatly
appreciated.

Related

SEO aspect about client side routing with angularjs or vuejs

Using a client side routing server side doesn't forge entire page to serve a client, but datas are downloaded from webapp "on demand".
So, in this scenario, if you see html code you could see something like this below:
<body>
<div class="blah">{{content}}</div>
</body>
I know that prerender strategy can be used and i think that probably google crawler is very smarty and can see contents anyway, but the question is:
is it good this approach on seo side?
Using prerender strategy server needs to generate page with content. Could be that a penalty in page speed factor?
Thank you in advance to everyone.
As you've mentioned google is pretty smart and from a recent experience, is able to fetch some of your site's static content even when using client-side rendering. However when it comes to client-side routing it's not quite there yet so if you need to have SEO, server side rendering frameworks like nuxt.js should be your go-to.
but datas are downloaded from webapp "on demand"
The same thing applies when you do asynchronous fetches (download on demand as you've described it), imagine the data inside your {{ content }} was coming from an external API, as far as I'm concerned no crawler at this time is able to deal with this, so your content area would just be empty. So generally speaking, when SEO is an requirement, so is server-side rendering.
Using prerender strategy server needs to generate page with content.
Could be that a penalty in page speed factor?
Yes and no. Load times will certainly go up a little, but when using client-side rendering, the client needs to render the page after loading it, so this time just gets shifted to your server. This applies again to asynchronous data fetching. The delivery of the site will take longer, but the data it has to fetch will already be there, so the client wont have to do it (SSR frameworks allow you to fetch data and render it before sending the site to the client). If you accumulate everything, there shouldn't be a huge difference in time from sending the request to actually seeing the rendered page in your browser.

Ionic 3 InAppBrowser capture request Pre Load

I am utilizing inAppBrowser and understand how to subscribe to event observable such as loadstart, loadstop etc. I am trying to figure out a solution for capturing the request made from within InAppBrowser instance previous to it being sent, similar to Angulars HTTPInterceptor feature when making crafted requests from within the app it's self.
As I understand it, loadstart has already committed to sending the request and all you can capture from this is the URL from within Ionic app.
As a solution I can executescript and utilize its callback to retrieve info about a request direct from the browser but this feels like a awkward solution.
Any alternate solutions or assistance would be greatly appreciated.

How to notify crawler that ajax powered page is completely loaded and ready to take snapshot

There are Angular/REST powered web pages, but with no navigation module being used (no hash based (#!) navigation).
Despite deprecating of google's ajax-crawling webmasters-ajax-crawling, it seems crawler only sees that JS generated content which does not rely on AJAX (REST) calls responses, and does not see page content which is depends on AJAX calls response.
It feels like google does not give enough time for a page to render, since it has no ability to identify if all expected logic in JS has finished completelly..
Q: is there a way to tell google (and to an abstract browser in general) that page completely rendered and no pending AJAX calls are there?
May be someone can suggest how to avoid rendering of page by angular - until all AJAX calls are completed (perhaps something like customized ng-cloak)?
Answering my own question..
It was asked because: it seemed that google failed to index text from
pages which is rendered by angular, after AJAX calls were performed.
Now: I see that google crawler actually indexes everything, so - no
need to notify crawler that page was rendered - it can recognize this
by itself.
But: I think google indexes pages in two phases: 1. Quickly indexing HTML of a page with no JS rendering involved (just after main document was fetched); 2. Performs heavy operation of rendering page with JS and indexes all rendered content. Second step may happen couple days after first one, so that's why you may see no indexed content for a while..

Force Reload of AngularJS Pages

Is there any way with AngularJS to force a page to refresh after it has been changed. What I mean by this is that I have multiple users actively working in the app but a change is required to the controller.js file. At this point the only way I'm aware of is for them to manually push refresh on the browser. Is there any code that I can use to make it "actively" watch that file for changes and reload when necessary without the users having to manually push refresh?
This isn't really an angular problem. You can do polling on the client side with setInterval, hitting the file on the server to trigger a refresh on the client.
If you're looking for something to speed up development, then you're probably looking for hot module loading. The solution depends on what version of angular and build tool you're using (e.g. grunt/webpack/npm).
Check out this article for angular 2, but you can find similar solutions for angular 1:
http://blog.mgechev.com/2015/10/26/angular2-hot-loader-hot-loading-tooling/
But if you just want to force a page refresh from the client side, you would just call: $window.location.reload()

Angular.js: prevent view loading when browser loads for the first time?

How can I prevent route loading when I hit refresh or when I load the page for the first time?
My backend respond with a chunk of HTML when ajax request and the whole page when normal request. If a normal request was made, I don't want angular to made the same request all over again to retrieve the same page but with a chunk of html instead of the whole page when the page loads.
How can I configure this?
May be you can't do that.
If you don't want the page to blink when angular load the whole page again, you can use the resolve attribute in angular-route or angular-ui-router.
You know, if angular don't load the page again, it can't handle user click or something else.
I have wrote a blog about this, researching the same problem with you, but in chinese. In the last, I decide to use resolve.
My blog url is http://isay.me/2014/06/angular-prerender-seo-and-use-resolve-for-page-flicker.html
Maybe you can have a look or not :)

Resources