#1451160 closed Feature Requests (fixed)
pre-cache images on login
| Reported by: | kingbyu | Owned by: | nobody |
|---|---|---|---|
| Priority: | 5 | Milestone: | 0.4-beta |
| Component: | User Interface | Version: | None |
| Severity: | normal | Keywords: | cache images login |
| Cc: |
Description
Images should be pre-cached so that pages load faster on the users first visit. I suggest loading the images in a hidden layer on the login page. That way, as the user types in his username and password, the browser is loading the images in the background, without notice.
Change History (7)
comment:1 Changed 6 years ago by r@…
- Severity set to critical
comment:2 Changed 6 years ago by r@…
- Severity changed from critical to normal
Well I don't really think the severity of this bug should be "critical"...
comment:3 Changed 5 years ago by seansan
- Milestone set to 0.1.5
- Summary changed from pre-cache images to pre-cache images on login
Review in 0.1.5. Methods exist to implement nowadays
comment:4 Changed 5 years ago by thomasb
- Milestone changed from 0.2.5 to later
comment:5 Changed 5 years ago by tensor
Nice feature to have.
comment:6 Changed 4 years ago by dan
- Keywords cache images login added
ticket #1485800 makes browser cache the images and use them on the next session even if SSL. Still has more images to download the first time but subsequent logins are a lot quicker.
Still a pretty good idea though.
comment:7 Changed 3 years ago by alec
- Milestone changed from later to 0.4-beta
- Resolution changed from None to fixed
- Status changed from assigned to closed
Implemented in [8e211adb].
Note: See
TracTickets for help on using
tickets.

I don't really know what I'm doing but thought I'd try getting my feet wet. The question really is which images should be preloaded - probably not all 128. I assume the answer is to preload only those images which are likely to appear immediately after the user logs in. I also assume it would be a good idea to try to preload the smallest (size of file) images first because they'll load more quickly and have more of an effect visually - no reason to preload the 16KB rcube_watermark.png first (or at all) which might take 5 seconds over a dialup line if it means no other images have a chance to preload.
Well anyway I added a config option to turn preloading off and on:
and some Javascript which does the work (images are loaded from smallest file size to largest):
--- program/include/main.inc Sun Mar 18 14:46:03 2007 +++ /usr/local/apache2/htdocs/program/include/main.inc Tue Mar 27 10:28:31 2007 @@ -1841,6 +1857,8 @@ { global $CONFIG, $OUTPUT, $JS_OBJECT_NAME, $SESS_HIDDEN_FIELD; + $skin_path = $CONFIG['skin_path']; + $labels = array(); $labels['user'] = rcube_label('username'); $labels['pass'] = rcube_label('password'); @@ -1912,6 +1930,69 @@ $form_end EOF; + if ($CONFIG['preload_images']) + { + $out .= <<<EOF + +<script type="text/javascript"> +<!-- + +var index = 0; +preload = new Array(); +preload[0] = "$skin_path/images/sort_desc.gif"; +preload[1] = "$skin_path/images/icons/reset.gif"; +preload[2] = "$skin_path/images/dimple.png"; +preload[3] = "$skin_path/images/icons/dot.png"; +preload[4] = "$skin_path/images/buttons/last_act.png"; +preload[5] = "$skin_path/images/buttons/first_pas.png"; +preload[6] = "$skin_path/images/buttons/next_act.png"; +preload[7] = "$skin_path/images/listheader_aqua.gif"; +preload[8] = "$skin_path/images/buttons/previous_pas.png"; +preload[9] = "$skin_path/images/listheader_dark.gif"; +preload[10] = "$skin_path/images/icons/replied.png"; +preload[11] = "$skin_path/images/searchfield.gif"; +preload[12] = "$skin_path/images/icons/folder-drafts.png"; +preload[13] = "$skin_path/images/icons/folder-inbox.png"; +preload[14] = "$skin_path/images/icons/folder-sent.png"; +preload[15] = "$skin_path/images/icons/attachment.png"; +preload[16] = "$skin_path/images/icons/folder-closed.png"; +preload[17] = "$skin_path/images/buttons/addressbook.gif"; +preload[18] = "$skin_path/images/icons/folder-junk.png"; +preload[19] = "$skin_path/images/buttons/logout.gif"; +preload[20] = "$skin_path/images/buttons/settings.gif"; +preload[21] = "$skin_path/images/buttons/mail.gif"; +preload[22] = "$skin_path/images/buttons/print_pas.png"; +preload[23] = "$skin_path/images/buttons/forward_pas.png"; +preload[24] = "$skin_path/images/buttons/compose_act.png"; +preload[25] = "$skin_path/images/buttons/reply_pas.png"; +preload[26] = "$skin_path/images/buttons/inbox_act.png"; +preload[27] = "$skin_path/images/buttons/replyall_pas.png"; +preload[28] = "$skin_path/images/taskbar.gif"; +preload[29] = "$skin_path/images/buttons/delete_pas.png"; +preload[30] = "program/blank.gif"; +preload[31] = "$skin_path/images/buttons/reply_act.png"; +preload[32] = "$skin_path/images/buttons/replyall_act.png"; +preload[33] = "$skin_path/images/buttons/forward_act.png"; +preload[34] = "$skin_path/images/buttons/print_act.png"; +preload[35] = "$skin_path/images/buttons/delete_act.png"; +preload[36] = "$skin_path/images/display/loading.gif"; +preload[37] = "$skin_path/images/icons/plus.gif"; +preload[38] = "$skin_path/images/buttons/compose_pas.png"; +preload[39] = "$skin_path/images/buttons/inbox_pas.png"; +preload[40] = "$skin_path/images/buttons/next_pas.png"; +preload[41] = "$skin_path/images/buttons/last_pas.png"; +preload[42] = "$skin_path/images/icons/deleted.png"; + +for(index = 0; index < preload.length; index++) +{ + imageObj = new Image(); + imageObj.src = preload[index]; +} + +//--> +</script> +EOF; + } return $out; }Hopefully this will be of use to someone.