I am developping a website with Django, hosted on Heroku, and still fairly new to it.
I published my application, and notice a problem when navigating on the hosted website :
Whenever you load a new page, it looks like images and css are reloading completely. For a short time (less than 1 second), It creates some king of glith on my menu bar because buttons are moving (because the image is missing) and changing color (because css is missing).
What would be a proper way to handle this ? Is it possible to store those image and css in somme kind of cookie on the user browser ?
Also, when i run the website on my localhost, i don't experiment the problem.
Thanks for your help !!
This not a issue per se, but due to the fact that your css image are not probably optimised, that plus Heroku is not your local server so the response time is slower, this is why you notice the static files being loaded.
However this is not a bug, depending on how big your statics are it will be more or less noticeable.
Your images and css will be cache on the client browser (not the cookie) so the website will run faster after several visits to your website.
Finally found the reason for cookie to be desactivated, i was still in DEBUG_MODE !
Related
I'm working on a Drupal 8.6 multi site installation, where every site has it's own database, and I'm having a problem where the first time a content is shared on Facebook it uses the wrong image.
The meta tag is configured right, it is something like this:
<meta property="og:image" content="https://xxxx.com/image.jpg?itok=w8tMeCC0" />
This image problem happens only at the first share and I believe it happens because the image has not been created yet at the moment of the first share.
I would like to know what I could do to force the image to be generated as soon as the content is published and if there is a way to create all the missing images.
I found this post and I'm trying to implement in a module (I never worked on Drupal before) but I don't even know how to schedule this piece of script to be executed.
Is there an existing module or setting that does that?
Thanks for any help!
Have you tried the facebook Debugger?
https://developers.facebook.com/tools/debug/
Facebook usually stores the metatags in cache during shares. What I usually do is debug the webpage at least once with the right metatags configured in the debugger and ensure the page loads correctly there.
Afterwards, the share will be loading all the assets correctly.
I installed prerender.io with Nginx on my Ember.js project.I use the Facebook debugger to check if the prerender is installed correctly. The problem:
Each first hit of the prerender is a fail. Unfortunately, Facebook caches this version, so it is the one that is displayed on the site.
When I ask "Fetch new scrape informations", I get a hit and the content is displayed properly.
How can I make the first try a hit?
GUESSES
Maybe there is a problem with window.prerenderReady, that is used in my project (ember-prerender)?
Maybe the Nginx configuration does not wait for the result of the caching, or the caching is too long?
INFOS
I use Nginx with the standard configuration recommended by prerender.io
Facebook can timeout if the response takes longer than 5 seconds. It sounds like your pages are taking 5+ seconds to render when being rendered on the fly. The reason it works the second time is because the page is cached at that point and returned in < 100ms.
I'd suggest trying to speed up your page loading time so that pages rendered on the fly are returned more quickly. Send and email to support#prerender.io if you want some help there! We can send you the timings of requests being made on your URLs.
The static page content comes from Django CMS which makes it dynamic , How is using nginx in such a scenario beneficial ?
It is generally considered a best practice to have "static" content served by a traditional web server such as Nginx or Apache. By static content, I am referring to things like CSS, JavaScript, and Images. Since these files often don't require modification between requests, there is little sense in having Django serve them. And Nginx/Apache can be serving these files to the client's browser concurrently.
However, your dynamic content served by Django needs to be rendered within the context of one or more Django templates. Not to mention, content such as blog posts needs to be retrieved from the database. Fortunately, Django has a robust caching system that you can use to cache the rendered HTML output and decrease server load and response times.
How much of a performance boost you gain really depends on the situation. I can tell you from experience that caching a complex response has reduced the response time from 300ms down to 30ms in one scenario.
EDIT: Adding a great article on Scaling Django: Caching and Static Content.
Meteor concatenates, minifies and compiles all html, css and javascript and sends them all to the client. But as I noticed, it's not useful for some cases.
For example, for most users we have app which works on myapp.com and another big part of app - admin dashboard works on myapp.com/admin. The size of admin part is compatible to the size of a main app part, but it's used only by hundreds of users or so. As a result most of the users load 2x size on client, half of which is useless and can't be used.
Does Meteor have solutions of this problem or maybe someone can suggest any hacks to solve it?
if you made your whole /admin/ section a separate package you could deploy two builds, with and without, and then route any clicks on "/admin/" URLs to "admin.APP.com/admin". both apps would of course need to talk to the same database.
Some people are using nginx proxy to decide what to serve, but this is not so much based on URLs as on some property of the userAgent, eg for mobile devices. this is nicer than having separate subdomains. the user doesn't see "admin.APP.com", the different backends are masked from them. But, you may not care so much about that. Having admin.* be explicit is a good thing.
A question like this was asked before and the person got nothing but criticisms, hope this won't be the case here.
I have a website that allows a business to add their menu to my site, and some have requested to be able to import a menu (a pdf or jpg) that is already online elsewhere. So I made a form that saves a url to the db and then that url is used in the src of an iframe on my site.
I tested it all and it worked fine on my local machine (using Django development server). When I synced it over to my production server and saved the same url I was testing with, the iframe loads no content.
I imagine that it has something to do with trying to read an individual file from another server because it works if I make the url google.com or to an image that is under my domain name. Is there anything I can do to fix this? Storing a url instead of a pdf in my db is much more efficient so doing this way is preferred over uploading their menu to my site.
I don't think this question needs any code attached, but if you want to see some let me hear it.
Thanks
The menu you're testing with probably has the X-Frame-Options response header set.
Is there a reason you're putting the image/pdf as the src on an iframe instead of just using the img tag (or putting an img tag inside your iframe)? There's still no guarantee that will work for all pages, as some sites will refuse to serve media to an external page, but I suspect this is your problem in this case.