My page doesnt load new styles, after I changed them - php

I'm having a problem inside wordpress custom-theme, where I enqueued style, but it doesn't seem to work without linking it in the index.php , when I edit the css I have to shift+f5 to see the changes, basically clearing the browser cache. My question is if there is any way to do this automatically.
Oh and also I forgot to mention, that I'm using WinSCP for reaching the FTP server of my wordpress website.
I tried to do the auto-clear cache using php, but with many attempts it didn't do anything or even better, prevented me from manually clearing the cache.
What I'm hoping for is 2 things: 1. My enqueued styles would work without linking them in html
2. The automatic clear-cache upon updating code using php

TL;DR Use Shift-F5 liberally when developing css, and disable any caching plugins on your site when developing anything.
Shift-F5 clears your browser cache. That cache holds objects like your css files, so your users' browsers don't have to download them again as they navigate from page to page on your site, or even when they return to your site later. That means css files are sticky. Using shift-F5 while working on your css is an inherent part of web development. There's no reliable way to clear css objects automatically.
Your sample code clears the server-side caches provided by a couple of caching plugins. Avoid that. Instead disable that kind of cache while hammering out your css.
WP_CACHE prevents the use of WordPress's persistent object cache, which handles entirely different kinds of data than CSS. It needs to be defined in wp-config.php to be useful, due to the arcane way persistent object caches are implemented (via an early-loading "drop-in" module). If the words "persistent object cache" don't mean anything to you, don't do anything with WP_CACHE.
Finally, your header() calls put headers on the HTML page you're generating, not not your css, javascript, or media objects. So, they're not useful for preventing browsers from caching your css.
In a typical WordPress / php / apache web server site, WordPress never touches the content of css: the browser requests those files directly from the web server. Some caching plugins adjust the caching headers on css, javascript and media. They do that by inserting web server directives into your site's .htaccess file. Disabling those plugins during css development helps avoid caching confusion.
Your browser devtools Network tab tells you which objects the browser retrieved from cache. It's super helpful when developing with cacheable objects.

Related

Laravel development on remote server experiences CSS/JavaScript change delays

I develop on a remote server. I'm not sure if this is a laravel caching tendancy, but CSS and JavaScript changes tend to be delayed longer than usual. I can make instant HTML and php changes, but sometimes it takes more than a few minutes for CSS and JavaScript changes to be reflected on a page. I do know that .blade.php files are generated and cached within an app/storage/views folder, but even when I delete those the changes are not reflected right away.
I have tried on Chrome and Firefox.
Any ideas? Thanks!
CSS and Javascript are not handled by Laravel.
You can check it from the .htaccess of the public folder
Most likely you are hitting the cache browser. One solution to avoid browser cache is to append to the css or javascript a unique identifier whenever there is a new release, e.g.:
site/my/css.css?12345
^
|
+ - Change this to force a fresh copy
What ended up working best was to clear the cached views on the server, as #dynamic hinted at (Laravel and Blade store these cached files).
AS WELL, to close the tab completely and re-access the webpage fresh. There were cases where it was still cached, and so I would just switch to another browser.

don't cache some HTML

I would like to know if I can exclude some of the HTML from being cached. I am using MediaWiki software. So any MediaWiki solution or any other PHP solution will work as well.
My Mediawiki pages are cached and I am implementing the site notice feature which expires after few days. But when pages are cached, it doesn't honor my expiration date and being displayed all the time. so I want to exclude that part of the code from being cached. I am implementing it as a MediaWiki extension.
Thanks
MediaWiki caching works in many layers. There are a number of server side caches, apart from the caching in the client. (As you might have noticed, MW i notoriously slow, unless you implement at least some of the caching functionalities.)
First of all you will want to figure out which sitenotices are cached. As I'm sure you are aware, there is more than one place where you can set the sitenotice:
MediaWiki:Anonnotice
MediaWiki:Sitenotice
$wgSiteNotice in LocalSettings.php
Through a few different extensions
Do they all stay on the page for too long?
Secondly, you can try and figure out where your sitenotice is cached:
Is there any difference if you are logged in/out? Some parts of the interface can be harder cached for anonymous users.
Does the message disappear if you clear you browsers cache?
Try and disable Varnish (or Squid), if you are using any of them.
Temporarily disable $wgEnableParserCache to see what difference it makes.
Set $wgCachePages = false; in your LocalSettings.php, to try and disallow client side caching

When coding HTML, browser doesn't always detect changes

When I'm coding HTML and CSS and load the page in the browser to check changes, sometimes it doesn't update for a while. This obviously causes problems with incremental changes where it's hard to tell if it's changed to suit my latest change or not.
I was wondering if there was a way around this? Possibly a browser (or mode) which is especially for this situation that doesn't have this behaviour?
Try Ctrl+F5 on Windows or Cmd+Shift+R on OSX, this will avoid your browser reading its cache when loading the page (at least when it's Chrome or Firefox)
You could try deleting your browser cache and reloading the page.
In case of CSS I also found sometimes I will need to load the CSS file separately in my browser and refresh it to update.
Sounds like your browser cache, you can test this by clearing it or doing a "hard refresh" to confirm.
You will need to throw some no cache headers if you want to stop this permanently, you can do this from the web server or server-side code depending on your setup (see How to control web page caching, across all browsers?)
On windows refresh with CTRL + F5. The browser will not show from cache. Also in developer tools you can tell it not load from cache
It is mostly because of browser cache.
Just a suggestion(You may find it useful, As an addition to other answers):
If you are on chrome then there is an option to disable cache while the dev toolbar is open. It works for me to ensure there is no caching while I am developing. (I keep my dev toolbar open all the time while developing so it works for me), Here is the screen shot.
Quote from chrome dev tools (https://developers.google.com/chrome-developer-tools/docs/settings)
General
Disable cache Will prevent the caching of resources ONLY for pages
which have DevTools open. This will not disable caching if the
DevTools are closed
.
Hmm could be a web server setting, caching request to your same resource. I used to see that a lot on tomcat with JSP. With tomcat we used to delete compiled classes ('work' folder), though, in your case with PHP you may check your server cache settings (files/sessions).
Example: "A typical web server, such as Apache, uses the time of file modification to inform a web browser of a requested page’s age, allowing the browser to take appropriate caching action. With dynamic web pages, the actual PHP script may change only occasionally; meanwhile, the content it displays, which is often fetched from a database, will change frequently."
Source : http://www.sitepoint.com/caching-php-performance/
Another workaround would be to touch (add a space and save) your PHP file when you want it to reload.

How do I create a "clear cache" button for my site?

I'd like to create a button on my site that COMPLETELY clears my cache. As neither Safari's nor Chrome's features work at all it seems. Is this possible?
Not possible. That'd expose low-level functionality to public access. Even if an exploit would simply empty your cache, it'd still be undesireable. Firefox and Chrome both use shift-ctrl-del for this, so at the cost of actually having to use your keyboard, you can do the same thing without the security risk.
It sounds like you want to clear the cached data that sits between your server and your browser, not the data that the browser has cached. A copy of your resources mat be sitting on a machine between your client computer and your server, and that is returning the cached copy, instead of asking your server for the data again.
You should read up on different caching methods, so you can set up certain types of files to be cached for a certain amount of time etc. Try this for starters.
I usually set up static resources (css, js, etc.) to be cached for a long period of time, but I change the URL when I have made changes to it. I usually do this by rewriting the request url so /resources/dummy/file.css becomes /resources/file.css and I can change dummy whenever I want. This creates the allusion of a different file (that hasn't been cached yet) but I don't have to rename the file.
RewriteRule resources/[^/]+/([^/]+)$ resources/$1
Highly doubt this is possible moreover you want it to be cross-browser. It will create serious security flaw to be exploit.

php http headers

Was wondering a couple of things.
Does http headers cache everything on the page. And if i have some javascript files will it cache them as well for subsequent pages, or is it more complicated then that. Example: If I cache all javascript files on page1.php will the files still be cached on page2.php or does it cache files for page1.php only apply to page1.php.
The other question is...
Should I scrap http headers and just use APC and if so how complicated is it, or in fact is it possible to use both(asking cuz yslow says to use http headers). Thanks for any info, Ive been reading but these questions weren't really answered in the text.
Your web server will take care of caching for you if you're just serving up regular .js files. The .js files will be downloaded the first time they are linked from one of your pages. When the user re-loads that page, or goes to another page entirely that uses the same .js file, the browser will used the cached copy. This applies when you load scripts via <script src="code.js"></script> tags.
That's if you have standalone, separate .js files. If, on the other hand, you JavaScript code buried in the HTML your PHP scripts generate, for example:
<script type="text/javascript">
alert("Hello world!");
</script>
...these scripts will be re-generated each time your .php file is loaded. If you're looking to cache the output of your PHP scripts then you will need to manage caching yourself by setting the appropriate HTTP headers from your PHP scripts, be that via the Cache-Control family of headers or the If-Modified-Since and ETag style of headers.
Caching and PHP files don't generally go together, though, since you're usually generating dynamic content that changes based on user input, the time of day, cookies, etc. As caching is purely an optimization the general programming warning against premature optimization applies. If you mess up your HTTP headers you can cause yourself a lot of headaches (believe me on that!). As a rule of thumb, you can probably just let Apache or IIS take care of advanced HTTP things like this and only muck around with HTTP headers if you have a specific need to do so.
I think you're confusing the different types of caching. You've talked about 3 or 4 very different things here.
browser caching -- any normal browser will cache images, JS files, and CSS files between pages. Meaning, the second time a browser wants to display any particular image from your site, it will load it from it's local disk cache instead of going back to your server for it. All this stuff just happens -- don't mess around with it, and it just works.
(exceptions: browsing user has turned off caching, you've changed headers to avoid caching, your mime.types aren't set up correctly so the browser doesn't treat these files correctly.)
server-side content caching -- if your pages are rendering slowly ON THE SERVER, you can use various disk-and-RAM caching schemes to keep the output around, and prevent the server from having to render each page each time. This only works for fairly static sites or static parts of pages.
APC content caching -- APC has commands that let you stuff arbitrary content into a server-side RAM cache. If a piece of your system takes a long time to render, but can be reused by many server hits, this is a good choice.
APC code caching -- Your text PHP scripts are "pseudo-compiled", then sent to the PHP runtime for execution. This "pseudo-compile" stage can be very slow and is redundant, so APC caches the "psuedo-compiled" PHP stage in RAM. It can speed up a whole website quite handily.
Sorry if this is TMI.

Categories