What Are The Drone Anti-jamming Systems Technology?
Unit 28 Week 2
1. Why are some websites
fast? (And others not?)
Image from: http://antiqueradios.com/forums/viewtopic.php?f=1&t=188309&start=20
2. Objectives
• Demonstrate an understanding of a
variety of factors that affect the
performance of a website
Image from: http://antiqueradios.com/forums/viewtopic.php?f=1&t=188309&start=20
3. Website Performance
• Assignment 2 – due one week today
– 21 November
• Email it to me before the start of the
lesson
• You should be able to complete this
task in today’s lessons!
Image from: http://antiqueradios.com/forums/viewtopic.php?f=1&t=188309&start=20
4. Assignment 2
Create a leaflet that explains to new
clients of YellowZebra the various
different factors that influence the
performance of a website. This should
include both server side and client side
(user side) factors. Include the benefits of
particular server side capabilities and also
the limitations of the equipment and
software that website users might be
using to access the website.
Image from: http://antiqueradios.com/forums/viewtopic.php?f=1&t=188309&start=20
5. What makes a Website Slow?
Part 1 – the files you’re using
Image from: http://antiqueradios.com/forums/viewtopic.php?f=1&t=188309&start=20
6. General Rule:
Bigger files = slower to load
Image from: http://antiqueradios.com/forums/viewtopic.php?f=1&t=188309&start=20
7. File Sizes
Rank the following types of file in
order biggest to smallest (on average)
• Audio
• Video
• Image (photo)
• Animation
Image from: http://antiqueradios.com/forums/viewtopic.php?f=1&t=188309&start=20
8. So what to do?
• If the files your website uses are too
big, what can you do?
1. Change the physical size of the file
2. Change the file type you chose
3. Increase compression
Image from: http://antiqueradios.com/forums/viewtopic.php?f=1&t=188309&start=20
9. Change physical size
• Zooming an image can make it
smaller
• Download an image from google
(anything appropriate!)
• Save it
• Resize to 50% in both dimensions
• Save again and compare file size
Image from: http://antiqueradios.com/forums/viewtopic.php?f=1&t=188309&start=20
10. Change physical size
• Images can be zoomed or cropped to
reduce the number of pixels –
more pixels = bigger file size
• Audio and video can be trimmed to
take less time –
more seconds = bigger file size
Image from: http://antiqueradios.com/forums/viewtopic.php?f=1&t=188309&start=20
11. File Types
• Download an image from google
(anything appropriate!)
• Open it in Paint and go to
File > Save As
• Save it in 3 different formats:
–.jpg
–.bmp
–.png
Image from: http://antiqueradios.com/forums/viewtopic.php?f=1&t=188309&start=20
12. Filet types and file size
• Not all image files are the same (the
same goes for video, audio, etc.)
• Some image types are uncompressed
– e.g. bmp, tiff
• Others compress data in different
ways - .jpg and png both reduce the
size from the .bmp but in different
ways
Image from: http://antiqueradios.com/forums/viewtopic.php?f=1&t=188309&start=20
13. Rule of thumb for images
• .jpg is smaller for photos
• .png is smaller (and looks better) for
vector images
• .gif can move
• All the other formats are not really
any good for the web
Image from: http://antiqueradios.com/forums/viewtopic.php?f=1&t=188309&start=20
14. Compression
• In some image editing programs (not
paint!) you can change the
compression settings for .jpg files
–A slider for image quality from 0 to 100
–Smaller file sizes means worse image
quality and visa versa
Image from: http://antiqueradios.com/forums/viewtopic.php?f=1&t=188309&start=20
16. Compression
• Video and Audio can also be
compressed
• MP3 is a common compressed audio file
that can be adjusted to sound better or
have smaller file size
• AVI or M4V are video files that can be
customised in the same way
• There are lots of other video and audio
file types that can do the same
Image from: http://antiqueradios.com/forums/viewtopic.php?f=1&t=188309&start=20
17. Assignment 2
Create a leaflet that explains to new clients of
YellowZebra the various different factors that influence
the performance of a website. This should include both
server side and client side (user side) factors. Include
the benefits of particular server side capabilities and
also the limitations of the equipment and software that
website users might be using to access the website.
You should make sure that you include some
information about file types (image files, sound
files, video and animation files and their different
Image from: http://antiqueradios.com/forums/viewtopic.php?f=1&t=188309&start=20
formats)…
18. What makes a Website Slow?
Part 2 – the user’s computer
Image from: http://antiqueradios.com/forums/viewtopic.php?f=1&t=188309&start=20
19. The User’s Computer
Obviously, if your computer is slow
and/or if your internet connection is
slow it will affect the way websites
work on your computer
Image from: http://antiqueradios.com/forums/viewtopic.php?f=1&t=188309&start=20
20. What can the designer do?
• You can’t make users get a faster
computer
• You can make sure your website
doesn’t have too many features that
will slow their computer down or
take ages to load over a slow
connection
Image from: http://antiqueradios.com/forums/viewtopic.php?f=1&t=188309&start=20
21. Assignment 2
Create a leaflet that explains to new clients of
YellowZebra the various different factors that influence
the performance of a website. This should include both
server side and client side (user side) factors. Include…
the limitations of the equipment and software that
website users might be using to access the website.
You should make sure that you include some
information about … user or client side factors
(download speed, computer performance factors –
cache memory, processor speed)…
Image from: http://antiqueradios.com/forums/viewtopic.php?f=1&t=188309&start=20
22. What makes a Website Slow?
Part 3 – Your web server
Image from: http://antiqueradios.com/forums/viewtopic.php?f=1&t=188309&start=20
23. Issues at your server
Obviously if the server is
overloaded, has slow hardware or a
slow internet connection your site will
seem slow
Image from: http://antiqueradios.com/forums/viewtopic.php?f=1&t=188309&start=20
24. Reasons for Overloaded Servers
• Too many people are accessing the site at
once
– Load balancing allows you to share one
website between several different servers to
share the pain
• The server has to sent loads and
loads of separate files for every
single page (e.g. image files)
– Combine images and use only part
of the mega image each time – this
is called “sprites”
Image from: http://antiqueradios.com/forums/viewtopic.php?f=1&t=188309&start=20
25. Reasons for Overloaded Servers
• The server has to rebuild a dynamic
page every time it’s loaded and that
takes more time than loading from
disk
–Dynamic pages are super useful (e.g.
all blogs are dynamic as are search
engines) but if there’s a lot of traffic
they can break
Image from: http://antiqueradios.com/forums/viewtopic.php?f=1&t=188309&start=20
26. Server Side Capabilities
• Turn compression on
–Most web servers can compress (like
ZIP) the actual HTML pages and other
text/code files as they are downloaded
• Use web caching
–Keep a copy of a dynamic page and
send that to the user instead of
rebuilding it each time
Image from: http://antiqueradios.com/forums/viewtopic.php?f=1&t=188309&start=20
27. Assignment 2
Create a leaflet that explains to new clients of
YellowZebra the various different factors that
influence the performance of a website. This
should include both server side and client
side (user side) factors. Include the benefits
of particular server side capabilities …
You should make sure that you include some
information about … server side factors (web
server capacity - bandwidth, and executions
to be performed before page load)
Image from: http://antiqueradios.com/forums/viewtopic.php?f=1&t=188309&start=20
28. Deadline Reminder
• Assignment 2 – due one week today
– 21 November
• Email it to me before the start of the
lesson
• You should be able to complete this
task in today’s lessons!
Image from: http://antiqueradios.com/forums/viewtopic.php?f=1&t=188309&start=20