Posts Tagged web
WordPress Performance Tips
Posted by Howard Yeend in Wordpress on October 9, 2010
WordPress is an excellent piece of software. It helps over 27 million people publish their blogs, and people view pages on WP-hosted blogs over 2.1 billion times a month(source). I use wordpress on all my blogs. But there is growing evidence that page load times are a large contributing factor to bounce rate – those people who close your site before it’s even finished loading. As google have recently shown, the future is instant, and if your blog is taking 7 seconds to load, that could be 6.5 seconds too long for some visitors.
This blog post will teach you how to optimize wordpress performance and keep your visitors more engaged. I’ll be taking you through each step as we speed up wordpress. These tips are largely independent of the theme you’re using, and I’ll guide you through the process as simply as I can.
Setting Up – Profile Your Site.
Why Diaspora won’t beat facebook, but you might.
Posted by Howard Yeend in Philosophy, web on September 15, 2010
“Diaspora, the ‘anti-Facebook’, is doomed”, says Milo Yiannopoulos of the Telegraph.
I agree, but not for the reasons Milo gives. He says Diaspora will fail because:
- Facebook’s really big.
- Zuck’s invested in it.
- There’s a lot of competition.
- Facebook’s well funded.
- Diaspora hasn’t launched yet.
I think those are simply the problems that any startup is bound to face – indeed, the situation was largely the same when facebook launched against the giant that was myspace, or when Microsoft decided to enter the same market as IBM.
But the topic itself is an interesting one. An investigation into how a startup might challenge Facebook’s dominancy will doubtless reveal some insights into more general approaches that web endeavors can take to sweep away their competitors.
Complete list of #JS1k tweet-sized entries
Posted by Howard Yeend in javascript on September 11, 2010
The #JS1k contest ended last night. It challenged web coders to write some interesting JavaScript in 1 kilobyte (1024 bytes) or less. That script is put into a basic html page which includes a canvas element and not much else. It’s a pretty crazy challenge – 1k is not a lot of code – and there are some really clever micro-optimisations going on in some of the entries.
But the homepage also states “Bonus points if your submission fits in one tweet ;)“. Now that’s a whole other level of madness. Useful code in 140 bytes? You’ve barely enough room to find the canvas element, let alone do anything with it!
So I decided to make an (unofficial) list of all the entries that are or claim to be tweet-sized. The current js1k homepage doesn’t offer a way to filter entries by size (hint, hint!), so I think this is pretty useful. I listed my own tweetable entries in an earlier post.
Also, I’m giving a copy of Douglas Crockford’s “Javascript: The Good Parts” as a prize for entry that the judges deem is the best of the tweetable ones. I think it’s a fitting prize, packing a whole lot of awesome into a thin package ;)
Google Instant Launches
Posted by Howard Yeend in web on September 8, 2010
Kapow! And the web wakes up and scrambles over itself to play with google’s latest, pretty bold, innovation in search: search-as-you-type, or in Google-speak “Google Instant”.
The new feature combines autosuggest with realtime search. The video below demoes the functionality, and it’s live right now on the search giant’s homepage if you’re signed in to your google account.
Here are some quick and dirty first impressions:
js1k: an allRGB entry in <1k of JavaScript
Posted by Howard Yeend in javascript on August 30, 2010
It’s contest season! The An Event Apart 10k JavaScript app contest has just ended (my entry got 2/5), there’s a node.js contest, and the JS1k contest is ending on Sept 10th. JS1k is a much purer contest, disallowing any external libraries, while the 10k contest allowed things like jQuery and external web services. As puts it, js1k is “An exercise in constraint, resulting in a kind of executable haiku”.
For js1k, I’ve entered a port of my PHP allRGB entry. The allRGB project is a great idea in itself – create an image which contains every possible colour in the RGB space exactly once. That’s 256*256*256 colours (=16777216), in a 4096×4096 image. Quite a challenge for PHP, and certainly not the kind of thing you’d attempt in JavaScript, right? ;D
Read the rest of this entry »
Writing a JavaScript app in 10k (#aea10k)
Posted by Howard Yeend in javascript, web on August 28, 2010
Two weeks ago I discovered the 10k JavaScript contest organised by An Event Apart. It challenged developers to “inspire the web with just 10K”. I knew I’d be cutting things fine with just 11 days left before the deadline (including 5 at work and 3 on holiday!) but I was desperate to enter an application.
You can play with the final entry right here – http://10k.aneventapart.com/entry/details/243 – voting closes today so please be generous with your votes and comments. I’ve literally just now come back from holiday so I haven’t had a chance to badger everyone to vote yet. Go and vote! ;)
The idea’s been kicking around my head for a while: Read the rest of this entry »
Some thoughts on JavaScript
Posted by Howard Yeend in Firefox, javascript on July 14, 2010
I don’t know about you, but I grew up doing image rollovers in JS and other groundbreaking “dhtml” stuff. Since then CSS has evolved, web standards and browsers have evolved, and things are much much nicer than before.
One thing that is starting to change is the way we fundamentally approach javascript. Not simply the recent popularity of libraries such as jQuery, allowing us to literally “change the way we write javascript”, but also there’s now much more awareness of the power that javascript has, and we’re doing more mission-critical stuff with JS. We’re moving from favouring simple procedural snippets of javascript that add twinkles to the page to fully object oriented JS applications, exporting great swathes of functionality away from the servers and onto the client.
This is a great thing. In fact it’s little short of a miracle; the servers are running faster and so are the clients! There seems to be no trade-off; by deeply integrating JavaScript into our web applications we’ve gained speed at both ends!
Not quite though.
XKCD Colour Survey – a 3D visualisation
Posted by Howard Yeend in javascript, machine learning on May 4, 2010
Randall Munroe (of XKCD) has been running a “name the colour” survey for the last few months and today released the data. The results are broken down by gender, and he makes some fascinating obvservations.
I’ve been working on a colour-related project on and off for about a year now, and part of that has involved creating visualisations of the RGB colour space – plotting red on the X axis, blue on Y, green on Z. So I thought it would be interesting to map XKCD’s 954 most common colour names in three dimensions – his charts are nice n’ all, but sexy javascript 3d is, well, sexier:
If you click that, you’ll be taken to the demo page, where you can interact with the cube. It’s a bit juddery, working entirely with divs and DOM manipulation, rather than canvas. Here’s a view from the side angle that shows off the “3d-ness” a bit more:
Of course, a canvas is really a better solution, so here’s a version that renders onto canvas, which is much much faster, but currently omits the names:
Fast PHP – effective optimisation and bottleneck detection
Posted by Howard Yeend in PHP, Productivity, web on April 18, 2010
PHP is not the fastest language on earth. That honour probably goes to machine code. But like many high-level languages, PHP provides some handy abstractions, like named variables, hashmaps (associative arrays), a C-like syntax, object oriented capabilities, loose typing and so on – we trade processing speed for development ease.
So it’s quite a common problem that people find their large PHP web applications running quite slowly.
Here are some frequently encountered bottlenecks found in web applications generally, and PHP specifically:
CSS Gradient Background – Cross Browser!
Posted by Howard Yeend in web on April 2, 2010
You read that right. This works in:
- Firefox >=3.6
- MSIE >=5.5 (!)
- Safari >=4
- Chrome
Oh Em Gee, I’ve got a CSS-applied Gradient.
How neat is this?
I mean really, this is super cool.
And it degrades gracefully in older browsers and Opera.
My boss Mike passed this little CSS gem to me, and now dear reader I pass it to you. It was orignally developed by FakeDarren, who posted a great little CSS button example. I find it useful for those times when designers get all fancy with gradiented backgrounds.
I’ve condensed Darren’s CSS down to these four lines plus comments, which will give you the lovely Green-to-Black CSS gradient background you can see above.
.gradientV{
/* thanks to http://blog.fakedarren.com/2010/01/cross-browser-css-gradients/ */
/* and https://puremango.co.uk/2010/04/css-gradient/ */
/* fallback (Opera) */
background: #008800;
/* Mozilla: */
background: -moz-linear-gradient(top, #00FF00, #000000);
/* Chrome, Safari:*/
background: -webkit-gradient(linear,
left top, left bottom, from(#00FF00), to(#000000));
/* MSIE */
filter: progid:DXImageTransform.Microsoft.Gradient(
StartColorStr='#00FF00', EndColorStr='#000000', GradientType=0);
}
And as you may have guessed by the ‘V’ in the class name, you can also do horizontal gradients – here are some more examples for left-right gradients, and we see what happens when we apply animations to a gradiented DIV.
Read the rest of this entry »
-
Save & Follow
-
Promote JS
Recent Comments