how to accelerate video upload vuejs

Question

My teammate and I are working on a pwa that you can see here: link to our pwa

The app has been launched last week. However some users told us that they were having issues while uploading their videos. The upload was taking too long even for small video (length of 50s).

We are using vue2Dropzone on vuejs. Do you have any ideas how to accelerate the process ? We have tried this approach that uses compression so that it goes faster: link to the compression approach

Would be nice if any of you had this use case and found a solution, even if it was not using vue2Dropzone.

Thanks all have a good day,

Answer 1

several days ago i have thought the same question like your's
now i have the idea:
first slice the video in several small pieces that has same size(<4MB),at same time create a manifest for the pieces and post the manifest to server.
the manifest like this:

{
    piecescount: 100,
    fileHASH: 'a1c2c3xxxxx',
    pieceslist:[
        {id: 1, piecesname: 'video_1.temp', status: 0}
        {id: 2, piecesname: 'video_2.temp', status: 0}
        ...
        {id: 100, piecesname: 'video_100.temp', status: 0}
    ]
}

status 0 means the file have upload yet
1 means is uploading the file now
2 means the file upload sucess
when begin to upload,loop through pieceslist.status

these are not code,just thinking process

for i in manitest.pieceslist
    if i.status==0
        set i.status=1
        upload the piece name=i.piecesname
        if upload sucess,set i.status=2
    elif i.status==1
        delete the piece named i.piecesname and reupload
        (because if client offline during upload,the piece maybe broken)
    elif i.status==2
        pass

after all of the pieces upload ,organize them to a file,and check the HASH
i think it makes upload more quick ,but also can breakpoint renewal