PERANCANGAN DAN IMPLEMENTASI VIDEO STREAMING BERBASIS HTML 5 PADA MESIN VIRTUAL
MAKALAH Disusun sebagai salah satu syarat menyelesaikan Program Studi Strata I pada Jurusan Teknik Informatika Fakultas Komunikasi & Informatika Universitas Muhammadiyah Surakarta
Oleh : Muhammad Fahrurozi NIM : L200070089
PROGRAM STUDI TEKNIK INFORMATIKA FAKULTAS KOMUNIKASI DAN INFORMATIKA UNIVERSITAS MUHAMMADIYAH SURAKARTA 2014
HALAMAN PENGESAHAN Publikasi ilmiah dengan judul : PERANCANGAN DAN IMPLEMENTASI VIDEO STREAMING BERBASIS HTML 5 PADA MESIN VIRTUAL Yang dipersiapkan dan disusun oleh : MUHAMMAD FAHRUROZI NIM : L200070089
Hari
: …………………………
Tanggal : …………………………
Pembimbing Dr. Heru Supriyono, M.Sc. NIK : 970
Publikasi ini sebagai salah satu persyaratan Untuk memperoleh gelar sarjana Tanggal : …………………………………….. Mengetahui, Ketua Program Studi Teknik Informatika
Dr. Heru Supriyono, M.Sc. NIK : 970
1
1
PERANCANGAN DAN IMPLEMENTASI VIDEO STREAMING BERBASIS HTML 5 PADA MESIN VIRTUAL
MUHAMMAD FAHRUROZI Teknik Informatika, Fakultas Komunikasi dan Informatika Universitas Muhammadiyah Surakarta E-Mail :
[email protected]
ABSTRAKSI Video streaming merupakan sarana berbagi informasi dalam bentuk visual gerak. Virtualisasi adalah cara efektif dan efisien dalam pemanfaatan suatu sumberdaya perangkat keras sebagai media server untuk video steraming. Pembuatan website pada versi HTML4 memiliki beberapa kekurangan secara teknis terutama pada teknologi multimedia. Pemanfaatan komputer server yang tidak optimal menyebabkan beberapa kerugian. Maka dari itu, website ini akan dibuat dengan menggunakan HTML versi 5 yang telah memiliki beberapa keunggulan dibanding versi sebelumnya kemudian di implementasikan pada mesin virtual. Tujuan dari penelitian ini adalah mengimplementasikan video streaming dan layanan tambahan ftp server pada mesin virtual. Analisis juga dilakukan dengan tujuan untuk mengetahui kecepatan transfer antara kedua mesin virtual yang sedang berjalan serta penganalisisan terhadap kinerja video streaming. Agar tujuan tersebut dapat dicapai, maka akan dibangun server dengan virtualisasi untuk pengimplementasian website & ftp server. Perangkat lunak pendukung yang digunakan antara lain sistem operasi mesin virtual Proxmox VE 3.1, sistem operasi server Ubuntu 12.04 Server i386 dan Ubuntu 13.10 Server amd64, web server Xampp, aplikasi remote login Putty, browser Mozilla Firefox terbaru yang telah terintegrasi dengan HTML5, Command Prompt, dan aplikasi tester jaringan SpeedConnect Internet Accelerator. Hasil akhir dari penelitian akan diujikan dan dilaporkan dalam bentuk data statistik software tester analisis kecepatan transfer dan data tabel analisis kualitas video. Pengambilan data analisis berdasarkan akumulasi jumlah klien yang diuji secara bertahap satu demi satu untuk mengukur sejauh mana kemampuan server mengirim data. Diharapkan kinerja website video streaming pada mesin virtual ini dapat berjalan secara lancar. Kata kunci : video streaming, mesin virtual, html5, virtualisasi, server. 1
2
kecepatan transfer dan kualitas kinerja
PENDAHULUAN Virtualisasi mengacu pada suatu cara
video streaming yang diimplementasikan
teknologi
pada mesinn virtual. Berdasarkan penelitian
sebuah
ini telah diperoleh data bahwa website video
perangkat fisik, seperti server, storage,
streaming yang telah diimplementasikan
network, atau system operasi diciptakan
pada server virtual mempunyai kecepatan
dalam versi virtual dengan kerangka kerja
transfer yang baik dan kinerja lancar
membagi sumberdaya menjadi satu atau
dengan kualitas video konstan tetap bagus.
penyederhanaan informasi.
infrastruktur
Dengan
kata
lain,
lebih lingkungan eksekusi. Keuntungan pada virtualisasi adalah
METODE PENELITIAN
setiap mesin virtual telah memiliki standar
Virtualisasi sendiri pada dasarnya
perangkat keras virtual sendiri, terlepas dari
juga dapat dikategorikan sebagai solusi
perangkat keras yang digunakan. Hal ini
untuk permasalahan optimasi komputer
berarti mesin virtual bisa berjalan pada
server yang dalam hal ini bisa komputer
server fisik apa pun yang digunakan dalam
server yang memang built-in atau pun
sebuah sistem. Sebuah mesin virtual dapat
hanya sekedar personal komputer yang
memungkinkan beberapa sistem operasi
dijadikan server yang belum dimanfaatkan
untuk berbagi sumberdaya pada satu host.
secara optimal.
Adobe Flash sudah tidak dibutuhkan lagi
untuk
menyaksikan
video
atau
Dengan virtualisasi, memungkinkan komputer
server beberapa
tersebut layanan
bisa
menyaksikan konten apapun di web (Steve
menambahkan
pada
Job, 2010). Dengan menggunakan bahasa
server tanpa mengganggu server lain ketika
pemrograman HTML 5, memungkinkan
salah satu layanan server down.
untuk menstrukturkan dan menampilkan isi
Ketergantungan akan aplikasi pihak
dari World Wide Web, sebuah teknologi
ketiga dalam pengolahan data berupa
inti
telah
gambar bergerak “video” pada website yang
dikembangkan untuk mendukung teknologi
masih berbasis HTML 4 tidak akan
(video/audio
streaming)
bermasalah bagi yang telah meng-install.
terbaru, mudah dibaca oleh manusia dan
Akan tetapi, seiring berjalannya waktu,
juga mudah dimengerti oleh mesin.
maka
dari
Internet.
multimedia
HTML
5
sesekali
aplikasi
tersebut
akan
Tulisan ini membahas hasil penelitian
meminta pembaharuan agar dapat memutar
video
video yang tersedia pada halaman situs
streaming berbasis HTML5 serta pengujian
yang diakses, terlepas dari update aplikasi
tentang
perancangan
website
3
browser. Bisa dikatakan pengguna harus
Keterangan :
memperbaharui
a.
dua
aplikasi
sekaligus
Pengumpulan bahan
untuk tetap bisa menonton video pada suatu
Pada tahap awal dalam penelitian ini
halaman
menggunakan
yaitu pengumpulan beberapa bahan-
syntax HTML 5, maka problema tersebut
bahan pendukung penelitian baik dari
akan
perangkat lunak maupun perangkat
situs.
Dengan
terselesaikan
dikarenakan
tidak
diperlukannya lagi aplikasi pihak ketiga dalam menampilkan video, cukup dengan memperbarui
aplikasi
browser
keras. b.
yang
Konfigurasi Server Tahap
ini
membahas
tentang
dipakai.
pemasangan platform mesin virtual
Alur Penelitian
Proxmox VE 3.1 pada komputer server
1.
dan mengkonfigurasinya.
Diagram Alir (Flow Chart) Penelitian Proses penelitian implementasi video
c.
Pembuatan Website dan Ftp server
streaming berbasis HTML5 ini dimulai
Pembuatan
dari
bahan
dengan mengkonfigurasi pada sistem
adapun
operasi, kemudian dilanjutkan dengan
analisis
sampai
pengumpulan
dengan
laporan,
proses/tahapan penelitian digambarkan
perancangan
dalam sebuah flowchart seperti pada
dipasang.
gambar 1:
d.
Ftp
server
website
dilakukan
yang
akan
Pengujian dan analisis Pada tahap ini, sistem yang telah dibuat akan diuji dengan beberapa poin analisis.
e.
Membuat laporan skripsi Langkah terakhir setelah penelitian dibuat serta diuji dan sudah dirasa mendapat hasil sesuai yang diharapkan, dilanjutkan penyusun laporan skripsi.
2.
Diagram
Alir
(Flow
Chart)
Perancangan Mesin Virtual Langkah perancangan dan konfigurasi mesin virtual dari implementasi video streaming dapat digambarkan proses Gambar 1 Diagram alir kegiatan penelitian
4
langkah-langkah diagram
alir
tersebut
sebagai
Dua mesin virtual yang telah dibuat
tersendiri
seperti
tadi kemudian dipasang sistem operasi
ditunjukkan pada gambar 2:
dari konten yang telah di-upload. d.
Instalasi dan konfigurasi Web Server Mesin virtual untuk layanan video streaming perlu diinstalasi web server dikarenakan projek ini berbasis HTML 5 agar dapat berjalan dan dapat diakses oleh komputer klien maupun komputer administrator pada browser.
e.
Instalasi Website Tahap terakhir setelah web server dipasang yaitu instalasi website yang telah
dibuat.
Dalam
hal
ini
penginstalasian yang dimaksud adalah pemasukan data-data website yang
Gambar 2 Diagram alir perancangan mesin
telah dibuat ke dalam web server yang
virtual Keterangan: a.
Instalasi Operating System (OS) mesin virtual Pertama-tama langkah yang dilakukan dalam perancangan mesin virtual yaitu dengan menginstalasi platform mesin virtual Proxmox VE 3.1 pada komputer server.
b.
Konfigurasi Setelah intalasi platform mesin virtual selesai, konfigurasi dapat dilakukan menggunakan website pada komputer klien maupun komputer administrator.
c.
Instalasi sistem operasi
ada di mesin virtual. 3.
Diagram Alir (Flow Chart) Website Video Streaming Website video straming dengan basis HTML 5 dirancang untuk berbagi informasi pengetahuan dalam bentuk video. Fitur akses yang disediakan untuk user secara umum diantaranya menu kategori, daftar video, tombol login, playlist dan play video, dan. Untuk administrator sendiri ada sedikit perbedaan pada halaman akses. Secara diagram
alir
(Flow
Chart)
dapat
digambarkan seperti pada gambar 3.:
5
e.
End Akhir dari proses di halaman admin adalah dengan memilih tombol logout dan kemudian akan dikembalikan ke halaman login lagi.
HASIL DAN PEMBAHASAN Pengujian penelitian
ini
video
streaming
menggunakan
pada media
komputer personal sebagai server dengan Gambar 3. Diagram Alir Website Video
spesifikasi Prosesor 4xIntel®
Core™ i5
CPU M450 @ 2.40 Ghz, RAM 3 GB dan
Streaming (Administrator) Keterangan:
Hardisk 320 GB dapat berjalan dengan
a.
Halaman utama (Homepage)
lancar seperti yang diharapkan.
Ketika user mengakses IP website
Hasil Pengujian
b.
c.
video streaming pada browser, maka
Pengetesan koneksi dilakukan oleh
tampilan pertaman yang akan muncul
komputer admin untuk mengetahui latency
adalah halaman utama.
ke server. Langkah yang dilakukan adalah
Login
dengan melakukan “ping” ke IP Proxmox,
Admin akan dihadapkan halaman login
website video streaming, dan ke ftp server.
setelah memilih (meng-click) tombol
Hasil dari checking latency didapat hasil
login di dalam halaman ini.
yang sangat memuaskan dengan latency
Login Sukses
rata-rata 1 ms untuk tiap server. Hasil ping
Setelah username dan password yang
ke server dapat dilihat pada gambar 4:
dimasukkan benar, administrator akan di bawa ke halaman admin. d.
Manajemen Website Pada halaman admin, tersedia beberapa menu yang fungsinya untuk mengatur konten-konten
website
yang
diantaranya upload dan menambahkan kategori video. Gambar 4 Cek Latency
6
Pengujian program dilakukan dengan
1
1
92071
metode saturation dimana pengambilan
2
2
48311
data analisis berdasarkan akumulasi jumlah
3
3
28639
klien yang diuji secara bertahap satu demi
4
4
22490
satu
mana
5
5
20250
kemampuan server dalam mengirim data.
6
6
18097
Parameter yang digunakan antara lain
7
7
18308
untuk
jumlah
mengukur
klien,
sejauh
kecepatan
transfer
dan
kualitas video. Analisis
Hasil dari pengujian pada 7 klien (1 komputer
kecepatan
transfer
pada
server
merangkap
klien)
menghasilkan beberapa nilai dari parameter
pengujian ini dilakukan pada komputer
perhitungan
administrator menggunakan yang telah
kecepatan rata-rata tiap pengujian. Dengan
diinstalasi perangkat lunak SpeedConnect
hasil diatas, dapat dicari perhitungan rata-
Internet Accelator untuk mengetahui stastik
rata dari keseluruhan pengujian dengan
deskriptif hasil pengujian. Hasil pengetesan
dasar rumus perhitungan kecepatan rata-
pertama data dengan menggunakan aplikasi
rata.
SpeedConnect Internet Accelator seperti
Kumpulan data sample kecepatan rata-rata
pada gambar 5.
dari hasil pengujian: 92071,
statistika,
salah
satunya
48311, 28639, 22490, 20250,
18097, 18308. +
̅= = Gambar 5 Pengetesan kecepatan
1.
Hasil pengujian kecepatan terhadap jumlah klien menggunakan aplikasi SpeedConnect
Internet
Accelator
didapatkan hasil seperti pada tabel 1: Tabel 1 Pengujian kecepatan Percobaan
Jumlah
Kecepatan
ke
klien
Transfer rata-rata
+ ⋯+
∑
̅ = 35452 Kbps 2.
Pengujian jumlah klien
terhadap
kualitas video Tabel 2 Pengujian kualitas Kualitas video
Jumlah klien
Baik
1
v
2
v
3
v
Sedang
Kurang
7
4
v
5
v
6
v
7
v
Berdasarkan
tabel
diatas,
dapat
dijabarkan bahwa jumlah klien didalam
Gambar 6 FTP Server Terhadap Kecepatan
penelitian ini tidak berpengaruh dengan
Video Streaming
kualitas video. Dapat ditunjukkan pada
Analisa dan pembahasan
tabel dengan semakin banyaknya angka
Penelitian tentang implementasi video
pada kolom klien tidak mengubah sama
streaming yang telah dilaksanakan ini
sekali
mendapatkan hasil yang sangat memuaskan
kualitas
video.
Hal
ini
bisa
dimaklumi karena spesifikasi komputer
pada
klien yang mumpuni untuk memutar video
kecepatan koneksi buffering. Hal ini bisa
kualitas mp4 dan kecepatan transfer paling
disebabkan beberapa faktor yaitu :
saat
pengujian,
yaitu
tentang
rendah masih diatas bitrate video yaitu
1.
Kecepatan jaringan lokal
18308 kbps banding 912 kbps.
2.
Spesifikasi server
3.
Pengujian ftp server terhada kecepatan
3.
Keadaan klien
video streaming
Kita tahu bahwa batas maksimum data
Untuk mengetahui kecepatan koneksi
transfer yang bisa dicapai di jaringan lokal
video streaming ketika ftp server
dengan menggunakan perangkat switch
sedang melakukan aktifitas download,
yaitu rata-rata dengan upload dan download
maka pengujian dilakukan dengan cara
1:1, 100:100 Mbps atau 12,5:12,5 MBps .
mengoperasikan dua layanan secara
Jika hanya untuk melewatkan data video
bersamaa. Di salah satu sisi, klien
format mp4 dengan bitrate sebesar 912
file
Kbps bukan merupakan hal yang sulit.
sebesar 819 MB. Pada waktu yang
Kondisi ini berkaitan dengan kualitas video
bersamaa
menguji
pada proses buffering yaitu pada kondisi 7
dengan menggunakan SpeedConnect
klien masih lancar tanpa delay. Proses
Internet Accelerator. Hasilnya dapat
streaming pada percobaan terakhir disini
dilihat pada gambar 6.
dapat digambarkan penerimaan data yang
melakukan
aktifitas
download
administrator
di-request klien sebesar 18308 Kb tiap detik, sedang video player pada website
8
menterjemahkan mp4 ke gambar gerak dan
muncul ketika video diunduh, sehingga
suara hanay sebesar 912 Kb tiap detik.
harus
Perlu ada keadaan
klien.
sedikit catatan Keadaan
tentang
klien
disini
diartikan bahwa PC klien dalam keadaan
mengganti
nama
video
dahulu
sebelum diunduh. Beberapa tombol di halaman
administrator
tanpa
form
konfirmasi persetujuan eksekusi.
normal. Tidak ada virus yang mengganggu kinerja komputer dan akhirnya bedampak
KESIMPULAN
pada jaringan. Pemasangan add-on yang
Berdasarkan rumusan masalah diatas,
tidak cocok dengan penelitian ini juga
yaitu bagaimana proses pembuatan dan
berpengaruh mengganggu kinerja video
implementasi video streaming berbasis
streaming seperti contoh add-on Internet
HTML 5 dan ftp server pada mesin virtual
Download Manager. Dampak dari add-on
dan bagaimana kinerja mesin virtual dan
tersebut antara lain menyebabkan player
video streaming setelah dianalisis. Video
dalam keadaan hang dan terpaksa harus
streaming berhasil diimplementasikan di
direload.
mesin virtual dengan cara men-deploy file
Penginstalan,
konfigurasi,
dan
website ke dalam mesin virtual dengan
pemakaian virtual server menggunakan
menggunakan
Proxmox VE 3.1 ini tidak sulit. Sehingga
beberapa keuntungan yang diperoleh dari
user friendly terhadap pemakai yang awam.
penelitian
Komputer personal sudah cukup mumpuni
jaringan yang tetap bagus meski pun
jika digunakan sebagai server dengan
dengan jumlah klien lumayan banyak. Akan
catatan komputer personal tersebut sudah
tetapi kecepatan koneksi akan turun juga
support
itu,
ketika pada waktu yang bersamaan terjadi
penulis tidak terlalu sulit dalam pengerjaan
traffic yang padat. Sehingga para user harus
penelitian ini.
berbagi kanal dalam pentransferan data
virtualisasi.
Oleh
karena
Antar muka website memang dibuat
aplikasi
ini
WinScp.
diantaranya
Ada
kecepatan
yang di-request
sangat minim tentunya berpengaruh dengan koneksi yang cenderung cepat ketika
PERSANTUNAN
diakses. Akan tetapi, website yang dibuat di
Makalah
ini salah
disusun
syarat
dapat
penelitian ini ada beberapa kekurangan
memenuhi
diantaranya tidak berjalan maksimal ketika
mendapatkan gelar sarjana pada Program
dioperasikan di browser Google Chrome.
Studi
Penginisialisasian nama video yang rumit
Komunikasi dan Informatika Universitas
Teknik
satu
agar
Informatika
dalam
Fakultas
9
Muhammadiyah
Surakarta.
Jurusan Teknik Informatika Universitas
Terselesaikannya makalah ini tidak lepas
Muhammadiyah
dari dukungan dan bantuan dari pihak lain.
pembimbing yang senantiasa memberikan
Oleh karena itu dalam kesempatan ini
waktu, nasehat dan bimbingannya kepada
penulis mengucapkan terimakasih kepada :
penulis
Dr. Heru Supriyono, M.Sc selaku Ketua
makalah penelitian ini.
sehingga
Surakarta
dapat
dan
selaku
menyelesaikan
DAFTAR PUSTAKA
Dutaspace. 2013, VPS Adela. Diakses 8 Oktober 2013,
. Hermison, MG. 2010, DESAIN DAN IMPLEMENTASI VIRTUALISASI SERVER DI PT THIESS CONTRACTORS INDONESIA. Skripsi. Yogyakarta : Universitas Gajah Mada. S, Farell Pratama, dkk. 2012, PERANCANGAN DAN IMPLEMENTASI APLIKASI VIDEO PLAYER MENGGUNAKAN HTML5. Skripsi. Salatiga : Fakultas Teknologi Informasi Jurusan Teknik Informatika, Universitas Kristen Satya Wacana. Saputra,
Ilham
B.
2012,
PERANCANGAN
DAN
IMPLEMENTASI
LOAD
BALANCING WEB SERVER MENGGUNAKAN HAPROXY. Skripsi. Surakarta : Fakultas Komunikasi Jurusan Teknik Informatika, Universitas Muhammadiyah Surakarta. Setiyawan, Miyan B. 2012, PERANCANGAN DAN IMPLEMENTASI WEB SERVER PADA MESIN VIRTUAL. Skripsi. Surakarta : Fakultas Komunikasi Jurusan Teknik Informatika, Universitas Muhammadiah Surakarta. Suryono, Tito, dkk. (2012) “Pembuatan prototype virtual server menggunakan Proxmox ve untuk optimalisasi resource hardware di NOC FKIP UNS”. Skripsi. Surakarta : Fakultas Keguruan dan Ilmu Pengetahuan. Univerversitas Negeri Sebelas Maret Surakarta. Wikipedia.
2013,
HTML5.
Diakses
8
oktober
. Wikipedia. 2013, Protokol Transfer Berkas. Diakses 16 oktober 2013,
2013,