This is related to my problem here:
Editing velocity template of Liferay changes not showing or takes a while
I've tried to investigate the caching problem and tried different things. Here's what I found out.
I just found out that my css is also delayed in showing the updates. I tweak my css file adding comment and testing it on my browser. Now just requesting it on the URL it will just give me an older version of the file. now if i put a query asking for version, (eg. mystyle.css?v2) it will pull the latest file and it records it. I can even see different version, eg. (mystyle.css?v1) or (mystyle.css?v2. I've cleaned my cache so it's definitely on the server side (i think).
Is there a way I can clear my cache?
Thank You!
you can activate Liferay's developer setting by including the properties that are in ROOT/WEB-INF/classes/portal-developer.properties.
Explanation: Liferay minifies and caches CSS and Javascript - once this is done it will not examine those for changes. The developer settings will disable that.
However, you don't want this setting active in production as this will mean that you'll have to load dozens of files instead of very few combined+minified, well cached, files.
I assume you are using this for development, not in production.
If you're having these problems in production, you should rather work with a proper theme plugin and redeploy that.
Related
Static Files in Odoo
I'm new to Odoo, and am working through developing a custom theme for a client. I've worked through the theme tutorial despite the many errors and omissions that exist in that documentation (going to make a pull request to update that after I'm done). My latest struggle is dealing with static files in Odoo, specifically images in the theme.
The Setup
Running Odoo 13.0.20200323 on Ubuntu 18.04 in VirtualBox managed by Vagrant and provisioned with Ansible
The Problem
Changes to image files in the static folder are not reflected on the website. This includes updating the theme in the website theme settings (the update function seems to update everything else). I've changed image names, image content, moved them into other folder, and have not been able to figure out how to have any changes updated on the website. I've restarted the server, doesn't change anything. Updated the theme as stated above, doesn't work. The only way I've been able to have any changes reflected on the front end is to completely destroy and rebuild the server.
Questions
What am I missing? Is there a function I'm not running to trigger Odoo to update what it serves from the static folder?
How does Odoo work with static files in general? On the fly updates to files in the static folder don't seem to have any changes on the front end. Are the files in the static folder copied somewhere else on install, and then served from that other location?
Understanding
I understand that having images and other files change in a folder called static, doesn't make much sense functionally, and that's not my intention for this. Since I'm in development I need to make changes to files, like SCSS, JS, and images, and have those updates reflected on the front end without having to destroy and rebuild the server every time. To be clear, changes to SCSS and JS files that I've registered in .xml files and bundled with various Odoo bundles update just fine when I make changes to them and then update the theme on the backend in the theme management view.
My desire is to understand how Odoo handles the files in the static folder in general, how to update those files properly, and how to manage them while developing and for release.
Answers
I've figured out an answer to the first part of the question as to what I'm doing wrong. It seems like a browser caching issue. When performing a hard reload, empty cache and hard reload, or visiting the site in an incognito window changes are reflected to imagery.
As far as I can tell Odoo is just serving files from the static folder directly. Please correct me if this is not the case.
Follow-up
Does anyone have a good solution for working with changes like this and dealing with browser caching issues?
Answer: I've set up a a couple gulp tasks that use gulp-rev (will replace with gulp-rev-all soon) rev-del and rev-rewrite to handle cache busting through appending hashes to the file names.
I'm going to try setting up Browser-sync in proxy mode to see how that deals with changes to files on reload. I'll report what I find!
Update: Browser-sync has worked well so far as expected. But was kind of useless until I figured out how to work out a fix for the problem below
Does anyone know of how to automate Odoo rebuilding SCSS, JS etc. bundles? So that on file change the theme can be updated and the results seen without having to manually update the theme on the backend to see the results?
Answer: The main task was figuring out how to get live HTML/XML updates working. Which meant building Odoo from the source, and not making any updates or changes to the theme on the backend or frontend from within the Odoo interface. Passing the option --dev xml to Odoo when starting it with odoo-bin allows for the XML code to be evaluated directly, and makes live updates possible. But this extremely helpful (almost necessary) functionality is broken when you make any updates to the them from within Odoo. I'll report on any work arounds to this, but for now as long as I don't touch the theme from within Odoo (update the theme or make edits to it with their editor) then it works great. Also I had to bypass bundling my CSS and JS with their bundler initially to get those updates working live, but may be able to go back and rebundle them now that the code is being evaluated directly.
⭐️Boilerplate and Tutorial Series ⭐️
I'm going to get my whole process for theme building dialed in and then I'll be sharing the boilerplate and build tools on GitHub and also writing and filming a tutorial series on it. Since the built in documentation on that front is straight up error filled, omits critical information and also
I'm very new to Typo3 and am struggling with a few cached images that refuse to update.
There has to be a option to deactivate all caching somewhere, and to flush everything. I need to know how.
What I have been expecting to find was one button that fixes it all. What I actually found was the following:
The directory /fileadmin/_processed_ contains resized images that the website creates and stores for later reuse, deleting the folder's content prompts the website to recreate everything from scratch, thus reflecting any changes to the original images that are stored elsewhere.
The directory /typo3temp/ runs a similar role like the one mentioned above, it contains semitemporary data from some installed extensions (unlike above not limited to image files). If a particular extension is causing trouble you might find (and empty) it's cache in this directory
/typo3temp/Cache appears to be of interest.
The Install tool accesible from the backend provides a few useful functions, most notably the clear all cache found under the tab important functions.
Furthermore there is a tab clean up which allow clearing cache_imagesizes, cache_md5params, cache_typo3temp_log amongst some other things that don't seem to be of greater interest.
I had the same problem when I switched to TYPO3 6.0
It was caused by the FAL (file abstraction layer).
The only way, displaying a newer verion of the picture was to rename it such like:
oldpicture = _picture
newpicture = oldpicture
I am using JBoss Application Server 4.2.
I have noticed that when I update an .xhtml file, my local server will immediately reflect the change. However, if I update a .js file, it will not update until I restart the server. This is a huge hassle when I am working with .js files; any time I want to test a change, I need to restart the server.
Is there a way I can force JBoss to stop caching the file? Please note, solutions like this one don't work; the framework automatically includes the .js file, and I cannot change the <script src="..."> text manually.
This isn't a very elegant "solution," but I have three workarounds I've been using which mitigate the problem. I'll post them below for anyone else who has the same problem as I did:
Edit the .xhtml file on the server to add a dummy GET variable to the filename in the <script src="..."> tag. See here. In my case, because I'm using an external framework, this meant editing a XML file, which the server apparently doesn't cache.
Advantages: this will reload properly every time.
Disadvantages: I have to make sure I don't deploy the code to production with the dummy GET variable. Also, I lose any breakpoints in my debugger, which doesn't recognize that it's the same JS file.
Edit the file on the server, then make the exact same changes dynamically in Chrome debugger. See here.
Advantages: no need to worry about breakpoints or deploying bad code. No need even reload the page.
Disadvantages: the changes disappear as soon as I hit the reload button. Also, it's easy to make a mistake when synching the code.
Put the JavaScript code in the .xhtml file under its own <script> tag, then migrate it over to the .js file when ready to commit the changes.
Advantages: page reloads properly each time.
Disadvantages: migrating the code to the .js is a hassle, and it's easy to accidentally introduce bugs.
Neither of these solutions is perfect, but they work as decent patches. Of course, if anyone has a real solution to actually make the server stop caching the file, I'd still love to hear it.
Our production Liferay instance absolutely refuses to deploy my latest theme. Something is preventing it from displaying my latest CSS changes. Unfortunately, there are NO log errors and no Firebug Console errors, so it's been a real headache to diagnose. I just get a really ugly plain page with links and no styles applied.
I have tried everything I can think of to fix this.
Undeploy/redeploy theme
restart the Glassfish container
use Liferay Server Administration page to "Clear content cached across this JVM", "Clear database cache", "Verify Database plugins", etc.
undeploy, restart, redeploy
undeploy, delete leftover files/folders pertaining to the theme in 'applications' folder, restart container, redeploy
clear my browser cache
try a different browser
many more combinations of the above. You get the idea.
Last night I reached the boiling point because my theme deployed and displayed in our test environments without issue, but didn't work in production. The only thing that was different is that I wasn't using
include-and-override=portal-developer.properties
in my portal-ext.properties file.
I took a gamble and added this line to my production portal-ext.properties and restarted the production server. My theme now displays without a problem.
The file portal-developer.properties only appears to contain the following properties:
theme.css.fast.load=false
theme.images.fast.load=false
javascript.fast.load=true
javascript.log.enabled=false
layout.template.cache.enabled=false
browser.launcher.url=
combo.check.timestamp=true
freemarker.engine.cache.storage=soft:1
freemarker.engine.modification.check.interval=0
openoffice.cache.enabled=false
velocity.engine.resource.manager.cache.enabled=false
com.liferay.portal.servlet.filters.cache.CacheFilter=false
com.liferay.portal.servlet.filters.etag.ETagFilter=false
com.liferay.portal.servlet.filters.header.HeaderFilter=false
com.liferay.portal.servlet.filters.themepreview.ThemePreviewFilter=true
So, finally, my question is, am I merely trading a slight performance boost for a massively easier deployment experience?
Or are there more serious concerns to loading this file in a production environment?
Thanks in advance for the input!
Ben
You'll get a really bad performance with that portal-ext.properties. That configuration is only intended to be used in development environments.
If you delete the css/.sass_cache directory on your deployed theme you'll see your css changes and you'll be able to use a different portal-ext.properties on production environment.
http://issues.liferay.com/browse/LPS-26939
Regards
I am the web guy for a large TV station. Our site is cached by Akamai. Pages render perfectly in our testing environment (not cached) and on our "origin" page (again, not cached), but when they are viewed on our live environment (the cached site), they do not render exactly the same as how I coded them. Maybe it's a tiny bit of spacing, maybe it's a CSS element (backgrounds especially) not displaying, and worst of all, forget all about floating DIVs. It's insane how much table design I have to do because of the failure to float.
Does anyone else have experience with caching like this? Is there a tool I can use to see the changes in rendering?
There is no one I can go to for support, because the company doesn't believe the problem exists. Please assist if you can.
The site is built on a VB.Net backend that I do not have access to. I only have access to the front end.
I've been working on sites behind Akamai and can honestly say they don't mess with your code, so that's not the issue. It's more than likely one of the following:
You have a cache latency issue - You updated your html and css, and one of the two updated while the other is still cached by Akamai or using timestamps to increment dependent files. There are several solutions here including making sure to clear cache via Akamai's control panel as well as more programmatic ways of coding. Headers can also be used though not really a preferred way.
Absolute URL's - Relative url's are best when testing on multiple environments to ensure your pointing everything to the same environment.
This is definitely an environment issue not an Akamai issue.
Are stylesheets, Javascript files etc all loading correctly from Akamai?
Can you save a copy of a page retrieved directly from your "origin" server and a copy saved using Akamai, then use diff to look for changes?
And, most importantly, have you asked Akamai about it? It's not really a programming question :)
Download all files as static files from development and then from production. And use a tool like WinMerge to see the differences.
Also does this problem go away if you do CTRL-F5 to refresh the browser?
Perhaps Akamaia isn't seeing the updated versions of your CSS files that are <link />'d in your HTML code? It might be a good idea to embed a version number in the URL so that when you release an updated version of the HTML, it's always going to ask Akamai for a new version of the CSS as well (this applies to images as well I suppose).
Theoretically, Akamai should recognize updated caching headers that your web server sends but I've never worked at a job where we didn't have to have some counter-measures in place to make sure that we could force Akamai to refresh its cached version.