List of bookmarklets for mobile debugging

List of bookmarklets for mobile web debugging

Posted on July 4, 2011 by Shi Chuan

Although we can’t install Firebug or ySlow on iPhone for mobile web front-end debugging, but every cloud has a silver lining, here is a list of bookmarklets come to the rescue.

Firebug Lite Stable – this is the main distribution channel. The Stable Channel is updated with features and bug fixes once they have been properly tested in the Beta channel.

Firebug Lite Debug – the Debug channel uses the same version as the Stable channel but with different pre-configurations to make it easier to debug Firebug Lite itself.

Firebug Lite Beta – the Beta channel is where the new features and fixes are polished. It should be considerably stable (no known regression), but it may contain some bugs and some features may be incomplete.

Firebug Lite Developer – the Developer channel is where the ideas get created and tested. Once it is tied directly to our code repository you’ll get the most recent code possible and will receive updates much more frequently than other channels. At the other hand, the Developer channel can be very unstable at times and the initial load can be slower.

YSlow for Mobile/Bookmarklet – YSlow for Mobile works as a bookmaklet. Users can now run the equivalent of regular YSlow in Mobile browsers as well as any bookmarklet enabled desktop browsers.

Mobile Perf bookmarklet – a cool mobile bookmarklets ‘boilerplate’ by Steve Sounder

How to use these?

They all work more or less the same way. For those that don’t have a clear instruction on how to use. Here is a step by step instruction that can be applied to all these bookmarklets:

Got a better one?

All of these are now listed on Mobile Boilerplate’s wiki section, if you know a better one, feel free to add to the list.

通过List of bookmarklets for mobile debugging | Shi Chuan’s blog.


HTML entities in numeric order

Named HTML entities in numeric order

Below are the entities listed in numeric order with definition and ISO numeric code. CSS ‘content’ does not accept named entities or regular numeric entities such as @, but does render ASCII text and unicode.

If you want to replace the bullets in a bulleted list with a different character, perhaps a ♥ or · you would need to use the unicode entity rather than the named or numeric entity: use the hexadecimal entity.

li:before {content:”\2665″; text-indent: -10px;}

JavaScript Special Characters / Entities

If you want to include characters in JavaScript, the process is very similar to the CSS inclusion method, except : in JavaScript use octal-encoded characters without a preceding 0 instead of the HTML entity for the normal chars, and the hex character preceded by a \u for all other characters..

alert(‘M\351nage \340 trois.’)

通过» Javascript, CSS, and (X)HTML entities in numeric order :: CSS, JavaScript and XHTML Explained.

Subversion Basics


Subversion Basics

In order to use these commands the following lines need to be added to /etc/bashrc on the machine that will access the repository:
export svnroot=svn+ssh://
export SVN_SSH="ssh -l $USER"

If you are intending to operate as root use su instead of su -

Common svn commands

Command Action
svn co $svnroot/project/trunk targetdir Checks out the trunk of the project into the targetdir.
also checkout
svn ci [filename] Commit the changes to the working copy or filename. VIM will be launched allowing you to enter a meaningful log message.
also commit
svn up Bring the current working copy up-to-date with the repository. Merges any changes in the repository with the working copy.
svn resolved Sometimes a merge or update will have a conflict. Files will be produced which share part of the filename with the conflicted file. Use those files and information inserted into the conflicted file to put the file in a workable state and use this command to let subversion know you fixed the problem. Then commit.
svn merge -rBASE:PREV [target] Reverts target back to the previous revision in a way that may be committed. PREV may be any previous revision number. This is only one small use of the merge command. See the next command for a more efficient operation.
svn cp -r489 $svnroot/project/trunk/target ./target Copies the target file or directory to the working copy with history from revision 489.
svn st Check the status of the working copy
also stat, status
svn diff [filename] Displays an inline diff of all the modifications to the working copy or to filename.
also di
svn revert target [target] Reverts targets back to a pristine copy of the repository. target may be . * or any filename.
svn cp file newfile Make a (cheap) copy of file.
also copy
svn mv file newfile Move or rename file to newfile.
also move, ren, rename
svn cp $svnroot/project/trunk $svnroot/project/tags/1.0

svn cp . $svnroot/project/tags/1.0

Tag version 1.0 of the project
1) from the current revision of the trunk.
2) from the current working copy.
In both cases the wc will not point to the new tag. (see svn sw)
svn cp $svnroot/project/trunk $svnroot/project/branches/experimental Branch the current revision of the trunk into the experimental branch.
The working copy will not point to the new branch. (see svn sw)
svn sw $svnroot/project/branches/experimental Switches the working copy to the experimental branch.
svn export $svnroot/project/tags/1.0 product Put a pristine copy of version 1.0 without administrative directories (no committing) into the product directory.

External Scripts

Command Action
svnchangesince Displays the log messages of all the changes to the repository since your last update
svnlastlog Displays the last log message that pertains to the current working copy.
svnlastchange Displays the last log message and a unified diff of the changes made in the last commit
svn-clean Removes all the files and directories that are not in Subversion

通过Subversion Basics.