Gsoc 2019 Project Overwiew — Final Report

Google summer of code is almost over and am absolutely excited to have worked on Musicblocks Projects for Sugarlabs under the mentors Walter Bender , Devin Ulibarri and Sumit Srivastava.

Aim :

The project aims to tune the performance by identify the causes of memory leaks , cpu consumption and finding areas to optimize to increase performance.

Development Period :

• My work started with the use of the Performance Tab for JavaScript profiling. After that I started working on adding promise to timeouts cause it was one of the major issues.
• I also worked on adding a Gulp task runner, which helps in minification of JS and CSS files,minification is one of the main methods used to reduce load times and bandwidth usage. it also improves site speed and accessibility, directly translating into a better user experience. It’s also beneficial to users accessing the music blocks web app through a limited data plan.
• I also employed the use of Dependabot that helps creates pull request and keep dependencies secure and up-to-date.
• I worked on re-writing the Service Worker code and also making Music Blocks a progressive web app. Service worker caching is very efficient as users expect the app to load faster on return visits thereby increasing load time and speed.it also assist in the offline development of the app.
• After that I worked on setting up a Python simpleHttpserver and wrote a guide for its operation.This is because when using the service worker it needs to be loaded via HTTP/HTTPS so that is why the local server was setup .Also to avoid CORS origin issue that we had with FFv68.
• I continued working on getting rid of the pesky timeout calls and also more profiling.
• And I also worked on chasing down globals, as they cause memory leaks.

Link to my Work

pull request/commits

sugarlabs/musicblocks

Branch of fork = https://github.com/fakela/musicblocks?organization=fakela&organization=fakela

Code that didn’t get merged

https://github.com/sugarlabs/musicblocks/pull/1819

https://github.com/sugarlabs/musicblocks/pull/1823

https://github.com/sugarlabs/musicblocks/pull/1835

Maintained a blog for my project progress = https://medium.com/@favourkelvin17

Future Scope

To work on getting rid of globals as they cause memory leak

My Process and my Gsoc experience:

My GSoC project aims on tuning performance in Music Blocks. There are metrics used to measure performance both for the client side and server side. But for the project I focused on the client side.

I used the profiler on the Chrome devtools. At one point I used gtmetrix which is focused on the server side. From the profiling, it showed that some timeouts where eating up CPU time, so i focused on getting rid of the pesky timeouts by making use of asynchronous functions, which involves adding a promise to the timeouts.Promises help to get to avoid race conditions .Also I focused on reducing the size of production code so i made use of Gulp it helps minification of production code which reduce load times and bandwidth usage it also improves site speed and accessibility etc. The above falls under the metrics used to measure performance .

At some point I tried unit testing with Karma and Jasmine, but that basically is to check that code is actually giving the right output. It wasn’t what I was supposed to focus on so I left that. (It would be a good focus for a follow-on project.) Next is the implementation of offline caching: creating a progressive web app using Service Worker, which helps to improve performance as the user does not need internet access after the file has loaded once and Music Blocks can be run as an app. I also added the Python simple Httpserver, because with the addition of Service Worker, Music Blocks won’t be loaded from file but has to be loaded through HTTP or HTTPS (before setting up the local server we had cors origin issue with FFv68). Also I created a Music Blocks Electron app, which was working perfectly but didn’t push forward with that cause Electron have security issues and their were also problems with the async call. After this I focused on clearing the pesky timeouts and did more profiling to find areas that consumes CPU time. Currently focusing on chasing memory leak which i have started and sent changes.

My gsoc experience :

Being a google summer of code student introduces you to many challenges , you have to be upfront, prompt, and give feed backs on what you have been working on which includes creating a blog and keeping it updated with weekly report .Also sharing the blog post during our meetings and highlighting work done during the week.

Experience with mentors:

Taking time to organize and be present for general meeting and also our weekly scheduled meeting, helping me out when in doubt ,suggestions to improve quality of work , guidance with steps that needs to be followed and overall keeping the work environment fun and interactive.

Acknowledgement :

I would like to thank my mentors Walter Bender ,Devin Ulibarri and Sumit Srivastava for their constant guidance and motivation. A big thanks to Sugar Labs community and Google Summer of Code (GSoC) for providing such a wonderful opportunity for learning and helping me to be an active member of Open Source Community.