Tag: cache

Categories
General

Photon: WordPress.com's Content Delivery Network

Dealing with side loads for heavy-traffic website sometime can be painful. But, of course there are some common practice to deal with this kind of situation. For example, you can take advantage of cache system, offload to other service to reduce server load/bandwidth, or using CDN (Content Delivery Network).
For WordPress-powered sites, you can take advantage from its Jetpack. This free plugin offered lots of handy features to help you work with your WordPress installation. One of them is a featured called Photon.

Give your site a boost by loading images in posts from the WordPress.com content delivery network. We cache your images and serve them from our super-fast network, reducing the burden on your Web host with the click of a button.

That’s right. You should see some big hints there: content delivery network, cache, super-fast network. To activate this feature, just hit the “Activate” button, and you’re set. All your uploaded media files will be served using WordPress.com infrastructure. After having this feature activated, all image URLs in your posts will be modified. For example:

  • Original URL: http://domain.com/dotsios300.png
  • New URL: http://i2.wp.com/domain.com/dotsios300.png

If you are interested, here is an example of the image header served from WordPress.com network.

HTTP/1.1 200 OK
Accept-Ranges: bytes
Cache-Control: public, max-age=63115200
Content-Type: image/png
Date: Sun, 06 Oct 2013 17:06:28 GMT
Expires: Wed, 07 Oct 2015 05:06:26 GMT
Last-Modified: Sun, 06 Oct 2013 17:05:27 GMT
Server: ECS (sin/47C6)
X-Bytes-Saved: 8597
X-Cache: HIT
X-Content-Type-Options: nosniff
X-nc: HIT iad 90
Content-Length: 46456
Categories
General

Cache is King


In this keynote presentation from HTML5DevConf, Steve Souders, Google’s Head Performance Engineer, clarifies the problem of caching, and explores various solutions to make your web app lightning fast.

Categories
General

Twitter Bootstrap, LESS CSS, and Caching Problem

I’m working on some works right now with a small team at the office. We decided to use Bootstrap as the front-end development framework. We came up with this solution for some key reasons:

  • We need to do it fast.
  • It’s easy to maintain, especially for a collaborative project
  • Bootstrap is cool.

There are lots of similar frameworks to choose like Skeleton, 960.gs, Blueprint, Foundation, and more. It didn’t take long discussion to take Bootstrap. Its features and flexibilities are just perfect for our need. The next thing is that we need to do some customisations, for example on the font sizes and colours. Since Bootstrap might release updates in the future, it’s better to leave the core files untouched.

LESS

Basically, it’s easy to customise them by using its own customisation tool. But, I prefer another method by using LESS. And yes, Bootstrap works great with LESS. The installation works straight forward. After downloading less.js file, add these two lines in the <head>

<link rel="stylesheet/less" href="/path/to/bootstrap.less">
<script src="/path/to/less.js"></script>

Inside bootstrap.less file, there is a little note that we can easily modify the font color and size by working on the variables.less file. I decided not to edit it. I created another .less file — for example: mycustom.less — and import it from bootstrap.less file. So, my bootstrap.less file looks like this:

...
@import "accordion.less";
@import "carousel.less";
@import "hero-unit.less";
// My Custom LESS
@import "mycustom.less";
...

And, this is what I have for mycustom.less:

@baseFontSize: 13px;
@tableBorder: #ddd;
@navbarInverseBackground: #faa141;
@navbarInverseBackgroundHighlight: #ec8b22;
@navbarInverseBorder: #d77c1b;
@navbarInverseLinkColor: #fff;

It should just work. But, does it work as expected? No.

Caching

Editing and saving mycustom.less file, and refreshing my page does not load the latest variables. It takes time to refresh/load the latest changes. It’s not good. It happens because less.js caches the .less files called using @import.
I tried to modify the web server setting by adding these lines in my httpd.conf file:

<FilesMatch ".less$">
Header set Cache-Control "no-cache"
</FilesMatch>

But, it didn’t work. After searching for solutions, there is a method offered for this issue. I added this line of code:
<script>localStorage.clear(); </script>
Now, whenever I make some changes on my .less files, reloading the page will give the latest changes. It works.

Categories
General

Let's bring this blog back!

This blog goes nowhere. It’ still here, still up and running, but I realized that there is no single post in the last… (almost) two months. Not to make any excuses, but I think I was busy. I’m still updating my other blog, though.
Few days ago, when I was working on some WordPress-powered blogs, I found that there are some changes. I upgraded some blogs — including some installed plugins, and I also found problems. But, the problems had been solved anyway. I logged in to my dashboard, and run some upgrade processes. One of the problems I found was a WordPress plugin called “Jetpack”. Anyway, if you haven’t heard about Jetpack, here is a little bit detail:

Jetpack is a plugin that connects to WordPress.com and enables awesome features, powered by our cloud infrastructure.

There are already some features included, but I think I only use of: WordPress.com Stats. Previously, I have WordPress.com Stats plugin installed, after having my blog upgraded to Version 3.1, the statistic plugin stopped working and left this message: “Your WordPress.com account is not authorized to view the stats of this blog”. After searching some answers, most of the solutions mentioned about having Jetpack replaced WordPress.com Stats.
But, when I tried to activate Jetpack — by authenticating to  WordPress.com account — it didn’t run smoothly. I got this error:

Your Jetpack has a glitch. Something went wrong that’s never supposed to happen. Guess you’re just lucky: xml_rpc-32601Try connecting again.

I tried again and again. I searched for a solution and the problem was because I have a cache plugin installed. By the way, I use W3 Total Cache. So, I disabled the cache settings, sent an authentication request, and voila! Problem solved. If you find problem just like what I had, now you know the solution.
I also made some theme modification here. I removed some features I considered as “not-too-important”. More importantly, it’s a matter of having some articles posted here. Shoot!

Categories
General

vBulletin Performance Optimization

I have been dealing with vBulletin for almost a year now. I manage a vBulletin installation for my friend at Fashionese Daily forum. Anyway, Fashionese Daily forum have used other forum/discusion engines like punBB and MyBB. It’s now using vBulletin 3.7.3 Patch Level 1.
It’s a pretty busy-traffic forum anyway. In average, there are 1,000 new posts everyday. According to forum stats, there are 500 – 600 online users during the prime ours (registered and guests). From the very beginning, I try to maintain its performance so that the forum is available.
Based on many articles about vBulletin optimization, here are what I did:

Continue reading “vBulletin Performance Optimization”
Categories
General

Modifying WordPress custom database error connection page

Database connection has a big role when we build using a dynamic webpage. To be more spesific, if we’re using WordPress it’s always a good thing to have our database connection alive. But, for some technical situation, database connection might be dropped. Like or not, this is the situation we might have.
To deal with high-traffic website, there is a WordPress plugin (note: we’re talking about WordPress here) called WP Super Cache. This plugin will help your WordPress installation to deal with major traffic, to keep our site alive e.g. when our site got a massive traffic from site like Digg or Slashdot. When there is a failure on MySQL database connection, there will be a page presented informing about problem on establishing database connection. A page that we want to avoid. The worst thing is that when this ‘temporary’ page is indexed by search engines.

Continue reading “Modifying WordPress custom database error connection page”