<?xml version="1.0"?>
<feed xmlns="http://www.w3.org/2005/Atom" xml:lang="en">
	<id>https://wiki.expertiza.ncsu.edu/api.php?action=feedcontributions&amp;feedformat=atom&amp;user=Krkulkar</id>
	<title>Expertiza_Wiki - User contributions [en]</title>
	<link rel="self" type="application/atom+xml" href="https://wiki.expertiza.ncsu.edu/api.php?action=feedcontributions&amp;feedformat=atom&amp;user=Krkulkar"/>
	<link rel="alternate" type="text/html" href="https://wiki.expertiza.ncsu.edu/index.php?title=Special:Contributions/Krkulkar"/>
	<updated>2026-07-15T03:05:43Z</updated>
	<subtitle>User contributions</subtitle>
	<generator>MediaWiki 1.41.0</generator>
	<entry>
		<id>https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=114443</id>
		<title>CSC/ECE 517 Fall 2017/E17A8. Use a profiler to identify the problems / pages that take some time to load &amp; fix them</title>
		<link rel="alternate" type="text/html" href="https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=114443"/>
		<updated>2017-12-04T20:54:59Z</updated>

		<summary type="html">&lt;p&gt;Krkulkar: /* Links */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;= Optimization for page loading in Expertiza =&lt;br /&gt;
&lt;br /&gt;
== '''Introduction''' ==&lt;br /&gt;
Expertiza is an online system that is used by students to view/submit assignments and review others' work. Expertiza also provides tools to visualize the scores and gauge the improvements made during the course semester. It also facilitates and monitors team projects. It is targeted at educational and non-profit organizations. The project is funded by the National Software Foundation (NSF), NCSU Learning in a Technology-Rich Environment (LITRE) program, the NCSU Faculty Center for Teaching and Learning, the NCSU STEM Initiative, and the Center for Advanced Computing and Communication.&lt;br /&gt;
&lt;br /&gt;
Expertiza is an open-source project with the source code available as a public repository on GitHub. It is developed using Ruby on Rails and is increasingly becoming robust thanks to the innumerable bugs being fixed by the community. The project has a micro-blog on SourceForge where the developer community report bugs and document updates.&lt;br /&gt;
&lt;br /&gt;
== '''Project Description''' ==&lt;br /&gt;
&lt;br /&gt;
1) Identifying the Expertiza pages which take time to load using Rack-mini-profiler and Flamegraphs.&lt;br /&gt;
&lt;br /&gt;
2) Propose fixes which would improve the Expertiza project.&lt;br /&gt;
&lt;br /&gt;
3) Optimizing the view, models and controllers for few of these corresponding fixes to improve the load time of these pages.&lt;br /&gt;
&lt;br /&gt;
== '''Gems Installed'''  ==&lt;br /&gt;
&lt;br /&gt;
*rack-mini-profiler :- Middleware that displays speed badge for every html page. Designed to work both in production and in development.&lt;br /&gt;
*flamegraphs :- Flame graphs are a visualization of profiled software, allowing the most frequent code-paths to be identified quickly and accurately.&lt;br /&gt;
*stackprof :- A sampling call-stack profiler for ruby 2.1+.Downloaded as a dependency for rack-mini-profiler.&lt;br /&gt;
*fast_stack :- fast_stack is dynamically resizable data structure optimized for fast iteration over the large arrays of similar elements avoiding memory fragmentation.&lt;br /&gt;
*Kaminari :- A Scope &amp;amp; Engine based, clean, powerful, customizable and sophisticated paginator for modern web app frameworks and ORMs.&lt;br /&gt;
&lt;br /&gt;
== '''Pages which needs to be optimized''' ==&lt;br /&gt;
&lt;br /&gt;
1) expertiza.ncsu.edu/grades/view?id=&amp;lt;ID of the team&amp;gt;&lt;br /&gt;
&lt;br /&gt;
2) expertiza.ncsu.edu/users/list&lt;br /&gt;
&lt;br /&gt;
== '''Project Design''' ==&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
For the purpose of this project, experts in the expertiza domain are Instructors. &lt;br /&gt;
&lt;br /&gt;
The following two patterns are implemented in the project - &lt;br /&gt;
&lt;br /&gt;
1.MVC Pattern - The project is implemented in Ruby on Rails that uses MVC architecture. It separates an application’s data model, user interface, and control logic into three distinct components (model, view, and controller, respectively). &lt;br /&gt;
&lt;br /&gt;
2.DRY Principle - We are trying to reuse the existing functionalities in Expertiza, thus avoiding code duplication. Whenever possible, code modification based on the existing classes, controllers, or tables will be done instead of creating the new one.&lt;br /&gt;
&lt;br /&gt;
3.Optimization - In order to optimize, we need to understand the factors which are causing the lag. This can be identified by using the flamegraph generation method and rack-mini-profiler statistics.&lt;br /&gt;
&lt;br /&gt;
=='''Approach'''==&lt;br /&gt;
To complete the given task, we identified the factors which are causing the lag. This was done by using flamegraph generation and rack-mini-profiler statistics. The statistics generated by rack miniprofiler helped us to understand the time taken by each component to get loaded. From these statistics, we identified the model/controller/view/database query which is causing this latency. From here, we identified the methods which needed to be implemented in order to optimize the webpage rendering.&lt;br /&gt;
&lt;br /&gt;
Optimization approach for the pages:&lt;br /&gt;
*users/list :- The approach to reduce loading time on this page was by implementing pagination. Instead of displaying all users and their data all at once, we display a certain number of users on one page, and rest of the users can be viewed by accessing the later pages. This reduces loading time of the page by reducing the amount of data to be fetched.&lt;br /&gt;
*grades/view : Ajax must be used for the optimization. Currently, all the data for all the teams present is loaded when the webpage is accessed. Instead, data for particular teams can be loaded when the user clicks on the expand button for that particular team. Thus, data for each team should be loaded asynchronously with ajax.&lt;br /&gt;
&lt;br /&gt;
== '''Analysis of the pages''' ==&lt;br /&gt;
&lt;br /&gt;
===FlameGraph Statistics===&lt;br /&gt;
The following is the flamegraph for this page:-&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:f.png]]&lt;br /&gt;
&lt;br /&gt;
The X axis of the FlameGraph represents the time taken to load the page. It can give a clear picture of where the expertiza page is getting bogged down. The widest layers take the longest to run. They’re the areas one should look into, because speeding them up could have the biggest impact. As we can see over here, most of the time taken over here is in the controller action.&lt;br /&gt;
&lt;br /&gt;
===MiniProfiler Statistics===&lt;br /&gt;
&lt;br /&gt;
The following is the rack-mini-profiler statistics for the page:-&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tre1.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
The box which is seen in the leftmost corner is the MiniProfiler statistics. MiniProfiler gives  a constant notification of how long each page takes to load. The miniprofiler statistics show the time taken to render the view as well as the corresponding SQL calls.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree2.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
This image shows the time and the number of SQL calls which are required for each rendering.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree5.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
Here as we can see the total number of SQL calls required for children_node_ng is 1123. This is causing the latency in the entire page by 10564.8 ms. These statistics helped us to identify the method which needs to be refactored.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree6.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
The total number of SQL calls required for 2 components here is 2 each. Hence we do not need to refactor this component.&lt;br /&gt;
&lt;br /&gt;
===  Solution ===&lt;br /&gt;
*'''users/list'''&lt;br /&gt;
The time taken to load the page was high because the server had to access through hundreds of rows in the database .The page was rendering the entire row of database at the same time. Pagination helped to split the database  into manageable chunks of data.&lt;br /&gt;
&lt;br /&gt;
Code added to app/controllers/users_controller.rb&lt;br /&gt;
  def list&lt;br /&gt;
    user = session[:user]&lt;br /&gt;
  	@users=Kaminari.paginate_array(user.get_user_list).page(params[:page])&lt;br /&gt;
  end&lt;br /&gt;
&lt;br /&gt;
Code added to app/models/user.rb&lt;br /&gt;
  &amp;lt;%= paginate @user %&amp;gt;&lt;br /&gt;
&lt;br /&gt;
Code added to app/views/users/list.html.erb&lt;br /&gt;
  &amp;lt;%= paginate @users %&amp;gt;&lt;br /&gt;
&lt;br /&gt;
*'''grades/view'''&lt;br /&gt;
The grades/view is the page where the instructor accesses the grades statistics of each student.&lt;br /&gt;
The reason for the slow down in the page is that the data for all the teams were loaded as soon as the page was loaded.The design of the page has an individual tab for each team, hence loading the entire data as soon as the page is loaded is quite redundant as the instructor needs to access the scores of each individual team at a given time.&lt;br /&gt;
The solution to this problem is to access the individual team statistics from the database when the instructor clicks the tab specified for the particular individual. &lt;br /&gt;
The existing code consists of a for loop in views/grades/_teams.html.erb, which renders the partial &amp;quot;views/grades/_tabbing.html.erb&amp;quot; which displays the data repeatedly. Instead, this partial could be rendered through AJAX or JQuery, whenever the expand button is clicked. This would save redundant loading of data and thus reduce the loading time of the page.&lt;br /&gt;
&lt;br /&gt;
'''Issues faced during implementation of this solution''':- &lt;br /&gt;
&lt;br /&gt;
*While implementing this fix, we first created a controller method, which would render the required partial &amp;quot;views/grades/_tabbing.html.erb&amp;quot; when called.We also created a route for this controller method. &lt;br /&gt;
*We passed the required data through the Rails params hash. However, since one argument that needed to be passed (tscore) is a Hash, when it enters the params hash, it is getting converted to a String. &lt;br /&gt;
*We tried passing the hash as it is, but after doing this all the data in the hash is not retained, i.e. there is a loss of data.&lt;br /&gt;
*We also tried converting the String back into Hash by using the eval method, and to_unsafe_h method.&lt;br /&gt;
*However, these methods require the hash to be present in a normal form i.e. key value pairs. &lt;br /&gt;
*But our hash has values as Objects, thus these methods cannot be applied&lt;br /&gt;
*Thus, we are unable to access the data in the String-hash. &lt;br /&gt;
*If this could be done, then our approach would result in successfully decreasing the loading time of the webpage.&lt;br /&gt;
&lt;br /&gt;
=='''Test Plan'''==&lt;br /&gt;
The project is based on optimizing the time required to load the pages which has been mentioned above,in order to test that there is an improvement in the time taken to load these pages one will have to compare the initial loading time and the time taken after the code has been modified.&lt;br /&gt;
&lt;br /&gt;
===Initial Setup for testing===&lt;br /&gt;
&lt;br /&gt;
1)Clone the git repository.&lt;br /&gt;
&lt;br /&gt;
2)Go to the commit on 3rd November(name: initial setup), this is the code which is originally provided by the professor and has not been modified. It however consists of the two gems required to check the loading time.&lt;br /&gt;
&lt;br /&gt;
3)To login as instructor :-&lt;br /&gt;
Username :- instructor6&lt;br /&gt;
Password :- password&lt;br /&gt;
&lt;br /&gt;
===Testing===&lt;br /&gt;
&lt;br /&gt;
Check the time taken to load the page localhost:3000/tree_display/list on the left corner and compare the same for the latest pull. You will notice a substantial reduction in the loading time.&lt;br /&gt;
&lt;br /&gt;
===Automated Test===&lt;br /&gt;
&lt;br /&gt;
There can be no automated test for this program since the improvement in the performance is due to the inclusion of the pagination gem. &lt;br /&gt;
&lt;br /&gt;
Hence testing if the pagination gem will work is equivalent to checking if rails is working. &lt;br /&gt;
&lt;br /&gt;
As testing rails is not recommended no automated test is added for changes made.&lt;br /&gt;
&lt;br /&gt;
=== Links ===&lt;br /&gt;
* Project Demo : https://www.youtube.com/watch?v=qQi6yqbmST4&amp;amp;t=4s&lt;br /&gt;
* Project Repository: https://github.com/sahildorwat/expertiza&lt;br /&gt;
* Pull request: https://github.com/expertiza/expertiza/pull/1122&lt;br /&gt;
* Github issue: https://github.com/expertiza/expertiza/issues/1121&lt;/div&gt;</summary>
		<author><name>Krkulkar</name></author>
	</entry>
	<entry>
		<id>https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=114441</id>
		<title>CSC/ECE 517 Fall 2017/E17A8. Use a profiler to identify the problems / pages that take some time to load &amp; fix them</title>
		<link rel="alternate" type="text/html" href="https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=114441"/>
		<updated>2017-12-04T20:40:12Z</updated>

		<summary type="html">&lt;p&gt;Krkulkar: /* Links */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;= Optimization for page loading in Expertiza =&lt;br /&gt;
&lt;br /&gt;
== '''Introduction''' ==&lt;br /&gt;
Expertiza is an online system that is used by students to view/submit assignments and review others' work. Expertiza also provides tools to visualize the scores and gauge the improvements made during the course semester. It also facilitates and monitors team projects. It is targeted at educational and non-profit organizations. The project is funded by the National Software Foundation (NSF), NCSU Learning in a Technology-Rich Environment (LITRE) program, the NCSU Faculty Center for Teaching and Learning, the NCSU STEM Initiative, and the Center for Advanced Computing and Communication.&lt;br /&gt;
&lt;br /&gt;
Expertiza is an open-source project with the source code available as a public repository on GitHub. It is developed using Ruby on Rails and is increasingly becoming robust thanks to the innumerable bugs being fixed by the community. The project has a micro-blog on SourceForge where the developer community report bugs and document updates.&lt;br /&gt;
&lt;br /&gt;
== '''Project Description''' ==&lt;br /&gt;
&lt;br /&gt;
1) Identifying the Expertiza pages which take time to load using Rack-mini-profiler and Flamegraphs.&lt;br /&gt;
&lt;br /&gt;
2) Propose fixes which would improve the Expertiza project.&lt;br /&gt;
&lt;br /&gt;
3) Optimizing the view, models and controllers for few of these corresponding fixes to improve the load time of these pages.&lt;br /&gt;
&lt;br /&gt;
== '''Gems Installed'''  ==&lt;br /&gt;
&lt;br /&gt;
*rack-mini-profiler :- Middleware that displays speed badge for every html page. Designed to work both in production and in development.&lt;br /&gt;
*flamegraphs :- Flame graphs are a visualization of profiled software, allowing the most frequent code-paths to be identified quickly and accurately.&lt;br /&gt;
*stackprof :- A sampling call-stack profiler for ruby 2.1+.Downloaded as a dependency for rack-mini-profiler.&lt;br /&gt;
*fast_stack :- fast_stack is dynamically resizable data structure optimized for fast iteration over the large arrays of similar elements avoiding memory fragmentation.&lt;br /&gt;
*Kaminari :- A Scope &amp;amp; Engine based, clean, powerful, customizable and sophisticated paginator for modern web app frameworks and ORMs.&lt;br /&gt;
&lt;br /&gt;
== '''Pages which needs to be optimized''' ==&lt;br /&gt;
&lt;br /&gt;
1) expertiza.ncsu.edu/grades/view?id=&amp;lt;ID of the team&amp;gt;&lt;br /&gt;
&lt;br /&gt;
2) expertiza.ncsu.edu/users/list&lt;br /&gt;
&lt;br /&gt;
== '''Project Design''' ==&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
For the purpose of this project, experts in the expertiza domain are Instructors. &lt;br /&gt;
&lt;br /&gt;
The following two patterns are implemented in the project - &lt;br /&gt;
&lt;br /&gt;
1.MVC Pattern - The project is implemented in Ruby on Rails that uses MVC architecture. It separates an application’s data model, user interface, and control logic into three distinct components (model, view, and controller, respectively). &lt;br /&gt;
&lt;br /&gt;
2.DRY Principle - We are trying to reuse the existing functionalities in Expertiza, thus avoiding code duplication. Whenever possible, code modification based on the existing classes, controllers, or tables will be done instead of creating the new one.&lt;br /&gt;
&lt;br /&gt;
3.Optimization - In order to optimize, we need to understand the factors which are causing the lag. This can be identified by using the flamegraph generation method and rack-mini-profiler statistics.&lt;br /&gt;
&lt;br /&gt;
=='''Approach'''==&lt;br /&gt;
To complete the given task, we identified the factors which are causing the lag. This was done by using flamegraph generation and rack-mini-profiler statistics. The statistics generated by rack miniprofiler helped us to understand the time taken by each component to get loaded. From these statistics, we identified the model/controller/view/database query which is causing this latency. From here, we identified the methods which needed to be implemented in order to optimize the webpage rendering.&lt;br /&gt;
&lt;br /&gt;
Optimization approach for the pages:&lt;br /&gt;
*users/list :- The approach to reduce loading time on this page was by implementing pagination. Instead of displaying all users and their data all at once, we display a certain number of users on one page, and rest of the users can be viewed by accessing the later pages. This reduces loading time of the page by reducing the amount of data to be fetched.&lt;br /&gt;
*grades/view : Ajax must be used for the optimization. Currently, all the data for all the teams present is loaded when the webpage is accessed. Instead, data for particular teams can be loaded when the user clicks on the expand button for that particular team. Thus, data for each team should be loaded asynchronously with ajax.&lt;br /&gt;
&lt;br /&gt;
== '''Analysis of the pages''' ==&lt;br /&gt;
&lt;br /&gt;
===FlameGraph Statistics===&lt;br /&gt;
The following is the flamegraph for this page:-&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:f.png]]&lt;br /&gt;
&lt;br /&gt;
The X axis of the FlameGraph represents the time taken to load the page. It can give a clear picture of where the expertiza page is getting bogged down. The widest layers take the longest to run. They’re the areas one should look into, because speeding them up could have the biggest impact. As we can see over here, most of the time taken over here is in the controller action.&lt;br /&gt;
&lt;br /&gt;
===MiniProfiler Statistics===&lt;br /&gt;
&lt;br /&gt;
The following is the rack-mini-profiler statistics for the page:-&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tre1.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
The box which is seen in the leftmost corner is the MiniProfiler statistics. MiniProfiler gives  a constant notification of how long each page takes to load. The miniprofiler statistics show the time taken to render the view as well as the corresponding SQL calls.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree2.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
This image shows the time and the number of SQL calls which are required for each rendering.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree5.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
Here as we can see the total number of SQL calls required for children_node_ng is 1123. This is causing the latency in the entire page by 10564.8 ms. These statistics helped us to identify the method which needs to be refactored.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree6.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
The total number of SQL calls required for 2 components here is 2 each. Hence we do not need to refactor this component.&lt;br /&gt;
&lt;br /&gt;
===  Solution ===&lt;br /&gt;
*'''users/list'''&lt;br /&gt;
The time taken to load the page was high because the server had to access through hundreds of rows in the database .The page was rendering the entire row of database at the same time. Pagination helped to split the database  into manageable chunks of data.&lt;br /&gt;
&lt;br /&gt;
Code added to app/controllers/users_controller.rb&lt;br /&gt;
  def list&lt;br /&gt;
    user = session[:user]&lt;br /&gt;
  	@users=Kaminari.paginate_array(user.get_user_list).page(params[:page])&lt;br /&gt;
  end&lt;br /&gt;
&lt;br /&gt;
Code added to app/models/user.rb&lt;br /&gt;
  &amp;lt;%= paginate @user %&amp;gt;&lt;br /&gt;
&lt;br /&gt;
Code added to app/views/users/list.html.erb&lt;br /&gt;
  &amp;lt;%= paginate @users %&amp;gt;&lt;br /&gt;
&lt;br /&gt;
*'''grades/view'''&lt;br /&gt;
The grades/view is the page where the instructor accesses the grades statistics of each student.&lt;br /&gt;
The reason for the slow down in the page is that the data for all the teams were loaded as soon as the page was loaded.The design of the page has an individual tab for each team, hence loading the entire data as soon as the page is loaded is quite redundant as the instructor needs to access the scores of each individual team at a given time.&lt;br /&gt;
The solution to this problem is to access the individual team statistics from the database when the instructor clicks the tab specified for the particular individual. &lt;br /&gt;
The existing code consists of a for loop in views/grades/_teams.html.erb, which renders the partial &amp;quot;views/grades/_tabbing.html.erb&amp;quot; which displays the data repeatedly. Instead, this partial could be rendered through AJAX or JQuery, whenever the expand button is clicked. This would save redundant loading of data and thus reduce the loading time of the page.&lt;br /&gt;
&lt;br /&gt;
'''Issues faced during implementation of this solution''':- &lt;br /&gt;
&lt;br /&gt;
*While implementing this fix, we first created a controller method, which would render the required partial &amp;quot;views/grades/_tabbing.html.erb&amp;quot; when called.We also created a route for this controller method. &lt;br /&gt;
*We passed the required data through the Rails params hash. However, since one argument that needed to be passed (tscore) is a Hash, when it enters the params hash, it is getting converted to a String. &lt;br /&gt;
*We tried passing the hash as it is, but after doing this all the data in the hash is not retained, i.e. there is a loss of data.&lt;br /&gt;
*We also tried converting the String back into Hash by using the eval method, and to_unsafe_h method.&lt;br /&gt;
*However, these methods require the hash to be present in a normal form i.e. key value pairs. &lt;br /&gt;
*But our hash has values as Objects, thus these methods cannot be applied&lt;br /&gt;
*Thus, we are unable to access the data in the String-hash. &lt;br /&gt;
*If this could be done, then our approach would result in successfully decreasing the loading time of the webpage.&lt;br /&gt;
&lt;br /&gt;
=='''Test Plan'''==&lt;br /&gt;
The project is based on optimizing the time required to load the pages which has been mentioned above,in order to test that there is an improvement in the time taken to load these pages one will have to compare the initial loading time and the time taken after the code has been modified.&lt;br /&gt;
&lt;br /&gt;
===Initial Setup for testing===&lt;br /&gt;
&lt;br /&gt;
1)Clone the git repository.&lt;br /&gt;
&lt;br /&gt;
2)Go to the commit on 3rd November(name: initial setup), this is the code which is originally provided by the professor and has not been modified. It however consists of the two gems required to check the loading time.&lt;br /&gt;
&lt;br /&gt;
3)To login as instructor :-&lt;br /&gt;
Username :- instructor6&lt;br /&gt;
Password :- password&lt;br /&gt;
&lt;br /&gt;
===Testing===&lt;br /&gt;
&lt;br /&gt;
Check the time taken to load the page localhost:3000/tree_display/list on the left corner and compare the same for the latest pull. You will notice a substantial reduction in the loading time.&lt;br /&gt;
&lt;br /&gt;
===Automated Test===&lt;br /&gt;
&lt;br /&gt;
There can be no automated test for this program since the improvement in the performance is due to the inclusion of the pagination gem. &lt;br /&gt;
&lt;br /&gt;
Hence testing if the pagination gem will work is equivalent to checking if rails is working. &lt;br /&gt;
&lt;br /&gt;
As testing rails is not recommended no automated test is added for changes made.&lt;br /&gt;
&lt;br /&gt;
=== Links ===&lt;br /&gt;
* Project Demo : https://www.youtube.com/watch?v=qQi6yqbmST4&amp;amp;t=4s&lt;br /&gt;
* Project Repository: https://github.com/sahildorwat/expertiza&lt;br /&gt;
* Pull request: https://github.com/expertiza/expertiza/pull/1120&lt;br /&gt;
* Github issue: https://github.com/expertiza/expertiza/issues/1121&lt;/div&gt;</summary>
		<author><name>Krkulkar</name></author>
	</entry>
	<entry>
		<id>https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=114429</id>
		<title>CSC/ECE 517 Fall 2017/E17A8. Use a profiler to identify the problems / pages that take some time to load &amp; fix them</title>
		<link rel="alternate" type="text/html" href="https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=114429"/>
		<updated>2017-12-04T18:59:13Z</updated>

		<summary type="html">&lt;p&gt;Krkulkar: /* Links */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;= Optimization for page loading in Expertiza =&lt;br /&gt;
&lt;br /&gt;
== '''Introduction''' ==&lt;br /&gt;
Expertiza is an online system that is used by students to view/submit assignments and review others' work. Expertiza also provides tools to visualize the scores and gauge the improvements made during the course semester. It also facilitates and monitors team projects. It is targeted at educational and non-profit organizations. The project is funded by the National Software Foundation (NSF), NCSU Learning in a Technology-Rich Environment (LITRE) program, the NCSU Faculty Center for Teaching and Learning, the NCSU STEM Initiative, and the Center for Advanced Computing and Communication.&lt;br /&gt;
&lt;br /&gt;
Expertiza is an open-source project with the source code available as a public repository on GitHub. It is developed using Ruby on Rails and is increasingly becoming robust thanks to the innumerable bugs being fixed by the community. The project has a micro-blog on SourceForge where the developer community report bugs and document updates.&lt;br /&gt;
&lt;br /&gt;
== '''Project Description''' ==&lt;br /&gt;
&lt;br /&gt;
1) Identifying the Expertiza pages which take time to load using Rack-mini-profiler and Flamegraphs.&lt;br /&gt;
&lt;br /&gt;
2) Propose fixes which would improve the Expertiza project.&lt;br /&gt;
&lt;br /&gt;
3) Optimizing the view, models and controllers for few of these corresponding fixes to improve the load time of these pages.&lt;br /&gt;
&lt;br /&gt;
== '''Gems Installed'''  ==&lt;br /&gt;
&lt;br /&gt;
*rack-mini-profiler :- Middleware that displays speed badge for every html page. Designed to work both in production and in development.&lt;br /&gt;
*flamegraphs :- Flame graphs are a visualization of profiled software, allowing the most frequent code-paths to be identified quickly and accurately.&lt;br /&gt;
*stackprof :- A sampling call-stack profiler for ruby 2.1+.Downloaded as a dependency for rack-mini-profiler.&lt;br /&gt;
*fast_stack :- fast_stack is dynamically resizable data structure optimized for fast iteration over the large arrays of similar elements avoiding memory fragmentation.&lt;br /&gt;
*Kaminari :- A Scope &amp;amp; Engine based, clean, powerful, customizable and sophisticated paginator for modern web app frameworks and ORMs.&lt;br /&gt;
&lt;br /&gt;
== '''Pages which needs to be optimized''' ==&lt;br /&gt;
&lt;br /&gt;
1) expertiza.ncsu.edu/grades/view?id=&amp;lt;ID of the team&amp;gt;&lt;br /&gt;
&lt;br /&gt;
2) expertiza.ncsu.edu/users/list&lt;br /&gt;
&lt;br /&gt;
== '''Project Design''' ==&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
For the purpose of this project, experts in the expertiza domain are Instructors. &lt;br /&gt;
&lt;br /&gt;
The following two patterns are implemented in the project - &lt;br /&gt;
&lt;br /&gt;
1.MVC Pattern - The project is implemented in Ruby on Rails that uses MVC architecture. It separates an application’s data model, user interface, and control logic into three distinct components (model, view, and controller, respectively). &lt;br /&gt;
&lt;br /&gt;
2.DRY Principle - We are trying to reuse the existing functionalities in Expertiza, thus avoiding code duplication. Whenever possible, code modification based on the existing classes, controllers, or tables will be done instead of creating the new one.&lt;br /&gt;
&lt;br /&gt;
3.Optimization - In order to optimize, we need to understand the factors which are causing the lag. This can be identified by using the flamegraph generation method and rack-mini-profiler statistics.&lt;br /&gt;
&lt;br /&gt;
=='''Approach'''==&lt;br /&gt;
To complete the given task, we identified the factors which are causing the lag. This was done by using flamegraph generation and rack-mini-profiler statistics. The statistics generated by rack miniprofiler helped us to understand the time taken by each component to get loaded. From these statistics, we identified the model/controller/view/database query which is causing this latency. From here, we identified the methods which needed to be implemented in order to optimize the webpage rendering.&lt;br /&gt;
&lt;br /&gt;
Optimization approach for the pages:&lt;br /&gt;
*users/list :- The approach to reduce loading time on this page was by implementing pagination. Instead of displaying all users and their data all at once, we display a certain number of users on one page, and rest of the users can be viewed by accessing the later pages. This reduces loading time of the page by reducing the amount of data to be fetched.&lt;br /&gt;
*grades/view : Ajax must be used for the optimization. Currently, all the data for all the teams present is loaded when the webpage is accessed. Instead, data for particular teams can be loaded when the user clicks on the expand button for that particular team. Thus, data for each team should be loaded asynchronously with ajax.&lt;br /&gt;
&lt;br /&gt;
== '''Analysis of the pages''' ==&lt;br /&gt;
&lt;br /&gt;
===FlameGraph Statistics===&lt;br /&gt;
The following is the flamegraph for this page:-&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:f.png]]&lt;br /&gt;
&lt;br /&gt;
The X axis of the FlameGraph represents the time taken to load the page. It can give a clear picture of where the expertiza page is getting bogged down. The widest layers take the longest to run. They’re the areas one should look into, because speeding them up could have the biggest impact. As we can see over here, most of the time taken over here is in the controller action.&lt;br /&gt;
&lt;br /&gt;
===MiniProfiler Statistics===&lt;br /&gt;
&lt;br /&gt;
The following is the rack-mini-profiler statistics for the page:-&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tre1.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
The box which is seen in the leftmost corner is the MiniProfiler statistics. MiniProfiler gives  a constant notification of how long each page takes to load. The miniprofiler statistics show the time taken to render the view as well as the corresponding SQL calls.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree2.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
This image shows the time and the number of SQL calls which are required for each rendering.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree5.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
Here as we can see the total number of SQL calls required for children_node_ng is 1123. This is causing the latency in the entire page by 10564.8 ms. These statistics helped us to identify the method which needs to be refactored.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree6.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
The total number of SQL calls required for 2 components here is 2 each. Hence we do not need to refactor this component.&lt;br /&gt;
&lt;br /&gt;
===  Solution ===&lt;br /&gt;
*'''users/list'''&lt;br /&gt;
The time taken to load the page was high because the server had to access through hundreds of rows in the database .The page was rendering the entire row of database at the same time. Pagination helped to split the database  into manageable chunks of data.&lt;br /&gt;
&lt;br /&gt;
Code added to app/controllers/users_controller.rb&lt;br /&gt;
  def list&lt;br /&gt;
    user = session[:user]&lt;br /&gt;
  	@users=Kaminari.paginate_array(user.get_user_list).page(params[:page])&lt;br /&gt;
  end&lt;br /&gt;
&lt;br /&gt;
Code added to app/models/user.rb&lt;br /&gt;
  &amp;lt;%= paginate @user %&amp;gt;&lt;br /&gt;
&lt;br /&gt;
Code added to app/views/users/list.html.erb&lt;br /&gt;
  &amp;lt;%= paginate @users %&amp;gt;&lt;br /&gt;
&lt;br /&gt;
*'''grades/view'''&lt;br /&gt;
The grades/view is the page where the instructor accesses the grades statistics of each student.&lt;br /&gt;
The reason for the slow down in the page is that the data for all the teams were loaded as soon as the page was loaded.The design of the page has an individual tab for each team, hence loading the entire data as soon as the page is loaded is quite redundant as the instructor needs to access the scores of each individual team at a given time.&lt;br /&gt;
The solution to this problem is to access the individual team statistics from the database when the instructor clicks the tab specified for the particular individual. &lt;br /&gt;
The existing code consists of a for loop in views/grades/_teams.html.erb, which renders the partial &amp;quot;views/grades/_tabbing.html.erb&amp;quot; which displays the data repeatedly. Instead, this partial could be rendered through AJAX or JQuery, whenever the expand button is clicked. This would save redundant loading of data and thus reduce the loading time of the page.&lt;br /&gt;
&lt;br /&gt;
'''Issues faced during implementation of this solution''':- &lt;br /&gt;
&lt;br /&gt;
*While implementing this fix, we first created a controller method, which would render the required partial &amp;quot;views/grades/_tabbing.html.erb&amp;quot; when called.We also created a route for this controller method. &lt;br /&gt;
*We passed the required data through the Rails params hash. However, since one argument that needed to be passed (tscore) is a Hash, when it enters the params hash, it is getting converted to a String. &lt;br /&gt;
*We tried passing the hash as it is, but after doing this all the data in the hash is not retained, i.e. there is a loss of data.&lt;br /&gt;
*We also tried converting the String back into Hash by using the eval method, and to_unsafe_h method.&lt;br /&gt;
*However, these methods require the hash to be present in a normal form i.e. key value pairs. &lt;br /&gt;
*But our hash has values as Objects, thus these methods cannot be applied&lt;br /&gt;
*Thus, we are unable to access the data in the String-hash. &lt;br /&gt;
*If this could be done, then our approach would result in successfully decreasing the loading time of the webpage.&lt;br /&gt;
&lt;br /&gt;
=='''Test Plan'''==&lt;br /&gt;
The project is based on optimizing the time required to load the pages which has been mentioned above,in order to test that there is an improvement in the time taken to load these pages one will have to compare the initial loading time and the time taken after the code has been modified.&lt;br /&gt;
&lt;br /&gt;
===Initial Setup for testing===&lt;br /&gt;
&lt;br /&gt;
1)Clone the git repository.&lt;br /&gt;
&lt;br /&gt;
2)Go to the commit on 3rd November(name: initial setup), this is the code which is originally provided by the professor and has not been modified. It however consists of the two gems required to check the loading time.&lt;br /&gt;
&lt;br /&gt;
3)To login as instructor :-&lt;br /&gt;
Username :- instructor6&lt;br /&gt;
Password :- password&lt;br /&gt;
&lt;br /&gt;
===Testing===&lt;br /&gt;
&lt;br /&gt;
Check the time taken to load the page localhost:3000/tree_display/list on the left corner and compare the same for the latest pull. You will notice a substantial reduction in the loading time.&lt;br /&gt;
&lt;br /&gt;
===Automated Test===&lt;br /&gt;
&lt;br /&gt;
There can be no automated test for this program since the improvement in the performance is due to the inclusion of the pagination gem. &lt;br /&gt;
&lt;br /&gt;
Hence testing if the pagination gem will work is equivalent to checking if rails is working. &lt;br /&gt;
&lt;br /&gt;
As testing rails is not recommended no automated test is added for changes made.&lt;br /&gt;
&lt;br /&gt;
=== Links ===&lt;br /&gt;
* Project Demo : https://www.youtube.com/watch?v=qQi6yqbmST4&amp;amp;t=4s&lt;br /&gt;
* Project Repository: https://github.com/sahildorwat/expertiza&lt;br /&gt;
* Pull request: https://github.com/expertiza/expertiza/pull/1120&lt;/div&gt;</summary>
		<author><name>Krkulkar</name></author>
	</entry>
	<entry>
		<id>https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=113857</id>
		<title>CSC/ECE 517 Fall 2017/E17A8. Use a profiler to identify the problems / pages that take some time to load &amp; fix them</title>
		<link rel="alternate" type="text/html" href="https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=113857"/>
		<updated>2017-11-29T23:01:06Z</updated>

		<summary type="html">&lt;p&gt;Krkulkar: /* Solution */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;= Optimization for page loading in Expertiza =&lt;br /&gt;
&lt;br /&gt;
== '''Introduction''' ==&lt;br /&gt;
Expertiza is an online system that is used by students to view/submit assignments and review others' work. Expertiza also provides tools to visualize the scores and gauge the improvements made during the course semester. It also facilitates and monitors team projects. It is targeted at educational and non-profit organizations. The project is funded by the National Software Foundation (NSF), NCSU Learning in a Technology-Rich Environment (LITRE) program, the NCSU Faculty Center for Teaching and Learning, the NCSU STEM Initiative, and the Center for Advanced Computing and Communication.&lt;br /&gt;
&lt;br /&gt;
Expertiza is an open-source project with the source code available as a public repository on GitHub. It is developed using Ruby on Rails and is increasingly becoming robust thanks to the innumerable bugs being fixed by the community. The project has a micro-blog on SourceForge where the developer community report bugs and document updates.&lt;br /&gt;
&lt;br /&gt;
== '''Project Description''' ==&lt;br /&gt;
&lt;br /&gt;
1) Identifying the Expertiza pages which take time to load using Rack-mini-profiler and Flamegraphs.&lt;br /&gt;
&lt;br /&gt;
2) Propose fixes which would improve the Expertiza project.&lt;br /&gt;
&lt;br /&gt;
3) Optimizing the view, models and controllers for few of these corresponding fixes to improve the load time of these pages.&lt;br /&gt;
&lt;br /&gt;
== '''Gems Installed'''  ==&lt;br /&gt;
&lt;br /&gt;
*rack-mini-profiler :- Middleware that displays speed badge for every html page. Designed to work both in production and in development.&lt;br /&gt;
*flamegraphs :- Flame graphs are a visualization of profiled software, allowing the most frequent code-paths to be identified quickly and accurately.&lt;br /&gt;
*stackprof :- A sampling call-stack profiler for ruby 2.1+.Downloaded as a dependency for rack-mini-profiler.&lt;br /&gt;
*fast_stack :- fast_stack is dynamically resizable data structure optimized for fast iteration over the large arrays of similar elements avoiding memory fragmentation.&lt;br /&gt;
*Kaminari :- A Scope &amp;amp; Engine based, clean, powerful, customizable and sophisticated paginator for modern web app frameworks and ORMs.&lt;br /&gt;
&lt;br /&gt;
== '''Pages which needs to be optimized''' ==&lt;br /&gt;
&lt;br /&gt;
1) expertiza.ncsu.edu/grades/view?id=&amp;lt;ID of the team&amp;gt;&lt;br /&gt;
&lt;br /&gt;
2) expertiza.ncsu.edu/users/list&lt;br /&gt;
&lt;br /&gt;
== '''Project Design''' ==&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
For the purpose of this project, experts in the expertiza domain are Instructors. &lt;br /&gt;
&lt;br /&gt;
The following two patterns are implemented in the project - &lt;br /&gt;
&lt;br /&gt;
1.MVC Pattern - The project is implemented in Ruby on Rails that uses MVC architecture. It separates an application’s data model, user interface, and control logic into three distinct components (model, view, and controller, respectively). &lt;br /&gt;
&lt;br /&gt;
2.DRY Principle - We are trying to reuse the existing functionalities in Expertiza, thus avoiding code duplication. Whenever possible, code modification based on the existing classes, controllers, or tables will be done instead of creating the new one.&lt;br /&gt;
&lt;br /&gt;
3.Optimization - In order to optimize, we need to understand the factors which are causing the lag. This can be identified by using the flamegraph generation method and rack-mini-profiler statistics.&lt;br /&gt;
&lt;br /&gt;
=='''Approach'''==&lt;br /&gt;
To complete the given task, we identified the factors which are causing the lag. This was done by using flamegraph generation and rack-mini-profiler statistics. The statistics generated by rack miniprofiler helped us to understand the time taken by each component to get loaded. From these statistics, we identified the model/controller/view/database query which is causing this latency. From here, we identified the methods which needed to be implemented in order to optimize the webpage rendering.&lt;br /&gt;
&lt;br /&gt;
Optimization approach for the pages:&lt;br /&gt;
*users/list :- The approach to reduce loading time on this page was by implementing pagination. Instead of displaying all users and their data all at once, we display a certain number of users on one page, and rest of the users can be viewed by accessing the later pages. This reduces loading time of the page by reducing the amount of data to be fetched.&lt;br /&gt;
*grades/view : Ajax must be used for the optimization. Currently, all the data for all the teams present is loaded when the webpage is accessed. Instead, data for particular teams can be loaded when the user clicks on the expand button for that particular team. Thus, data for each team should be loaded asynchronously with ajax.&lt;br /&gt;
&lt;br /&gt;
== '''Analysis of the pages''' ==&lt;br /&gt;
&lt;br /&gt;
===FlameGraph Statistics===&lt;br /&gt;
The following is the flamegraph for this page:-&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:f.png]]&lt;br /&gt;
&lt;br /&gt;
The X axis of the FlameGraph represents the time taken to load the page. It can give a clear picture of where the expertiza page is getting bogged down. The widest layers take the longest to run. They’re the areas one should look into, because speeding them up could have the biggest impact. As we can see over here, most of the time taken over here is in the controller action.&lt;br /&gt;
&lt;br /&gt;
===MiniProfiler Statistics===&lt;br /&gt;
&lt;br /&gt;
The following is the rack-mini-profiler statistics for the page:-&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tre1.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
The box which is seen in the leftmost corner is the MiniProfiler statistics. MiniProfiler gives  a constant notification of how long each page takes to load. The miniprofiler statistics show the time taken to render the view as well as the corresponding SQL calls.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree2.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
This image shows the time and the number of SQL calls which are required for each rendering.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree5.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
Here as we can see the total number of SQL calls required for children_node_ng is 1123. This is causing the latency in the entire page by 10564.8 ms. These statistics helped us to identify the method which needs to be refactored.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree6.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
The total number of SQL calls required for 2 components here is 2 each. Hence we do not need to refactor this component.&lt;br /&gt;
&lt;br /&gt;
===  Solution ===&lt;br /&gt;
*'''users/list'''&lt;br /&gt;
The time taken to load the page was high because the server had to access through hundreds of rows in the database .The page was rendering the entire row of database at the same time. Pagination helped to split the database  into manageable chunks of data.&lt;br /&gt;
&lt;br /&gt;
Code added to app/controllers/users_controller.rb&lt;br /&gt;
  def list&lt;br /&gt;
    user = session[:user]&lt;br /&gt;
  	@users=Kaminari.paginate_array(user.get_user_list).page(params[:page])&lt;br /&gt;
  end&lt;br /&gt;
&lt;br /&gt;
Code added to app/models/user.rb&lt;br /&gt;
  &amp;lt;%= paginate @user %&amp;gt;&lt;br /&gt;
&lt;br /&gt;
Code added to app/views/users/list.html.erb&lt;br /&gt;
  &amp;lt;%= paginate @users %&amp;gt;&lt;br /&gt;
&lt;br /&gt;
*'''grades/view'''&lt;br /&gt;
The grades/view is the page where the instructor accesses the grades statistics of each student.&lt;br /&gt;
The reason for the slow down in the page is that the data for all the teams were loaded as soon as the page was loaded.The design of the page has an individual tab for each team, hence loading the entire data as soon as the page is loaded is quite redundant as the instructor needs to access the scores of each individual team at a given time.&lt;br /&gt;
The solution to this problem is to access the individual team statistics from the database when the instructor clicks the tab specified for the particular individual. &lt;br /&gt;
The existing code consists of a for loop in views/grades/_teams.html.erb, which renders the partial &amp;quot;views/grades/_tabbing.html.erb&amp;quot; which displays the data repeatedly. Instead, this partial could be rendered through AJAX or JQuery, whenever the expand button is clicked. This would save redundant loading of data and thus reduce the loading time of the page.&lt;br /&gt;
&lt;br /&gt;
'''Issues faced during implementation of this solution''':- &lt;br /&gt;
&lt;br /&gt;
*While implementing this fix, we first created a controller method, which would render the required partial &amp;quot;views/grades/_tabbing.html.erb&amp;quot; when called.We also created a route for this controller method. &lt;br /&gt;
*We passed the required data through the Rails params hash. However, since one argument that needed to be passed (tscore) is a Hash, when it enters the params hash, it is getting converted to a String. &lt;br /&gt;
*We tried passing the hash as it is, but after doing this all the data in the hash is not retained, i.e. there is a loss of data.&lt;br /&gt;
*We also tried converting the String back into Hash by using the eval method, and to_unsafe_h method.&lt;br /&gt;
*However, these methods require the hash to be present in a normal form i.e. key value pairs. &lt;br /&gt;
*But our hash has values as Objects, thus these methods cannot be applied&lt;br /&gt;
*Thus, we are unable to access the data in the String-hash. &lt;br /&gt;
*If this could be done, then our approach would result in successfully decreasing the loading time of the webpage.&lt;br /&gt;
&lt;br /&gt;
=='''Test Plan'''==&lt;br /&gt;
The project is based on optimizing the time required to load the pages which has been mentioned above,in order to test that there is an improvement in the time taken to load these pages one will have to compare the initial loading time and the time taken after the code has been modified.&lt;br /&gt;
&lt;br /&gt;
===Initial Setup for testing===&lt;br /&gt;
&lt;br /&gt;
1)Clone the git repository.&lt;br /&gt;
&lt;br /&gt;
2)Go to the commit on 3rd November(name: initial setup), this is the code which is originally provided by the professor and has not been modified. It however consists of the two gems required to check the loading time.&lt;br /&gt;
&lt;br /&gt;
3)To login as instructor :-&lt;br /&gt;
Username :- instructor6&lt;br /&gt;
Password :- password&lt;br /&gt;
&lt;br /&gt;
===Testing===&lt;br /&gt;
&lt;br /&gt;
Check the time taken to load the page localhost:3000/tree_display/list on the left corner and compare the same for the latest pull. You will notice a substantial reduction in the loading time.&lt;br /&gt;
&lt;br /&gt;
===Automated Test===&lt;br /&gt;
&lt;br /&gt;
There can be no automated test for this program since the improvement in the performance is due to the inclusion of the pagination gem. &lt;br /&gt;
&lt;br /&gt;
Hence testing if the pagination gem will work is equivalent to checking if rails is working. &lt;br /&gt;
&lt;br /&gt;
As testing rails is not recommended  no automated test is added  for  changes made.&lt;/div&gt;</summary>
		<author><name>Krkulkar</name></author>
	</entry>
	<entry>
		<id>https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=113856</id>
		<title>CSC/ECE 517 Fall 2017/E17A8. Use a profiler to identify the problems / pages that take some time to load &amp; fix them</title>
		<link rel="alternate" type="text/html" href="https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=113856"/>
		<updated>2017-11-29T23:00:42Z</updated>

		<summary type="html">&lt;p&gt;Krkulkar: /* Solution */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;= Optimization for page loading in Expertiza =&lt;br /&gt;
&lt;br /&gt;
== '''Introduction''' ==&lt;br /&gt;
Expertiza is an online system that is used by students to view/submit assignments and review others' work. Expertiza also provides tools to visualize the scores and gauge the improvements made during the course semester. It also facilitates and monitors team projects. It is targeted at educational and non-profit organizations. The project is funded by the National Software Foundation (NSF), NCSU Learning in a Technology-Rich Environment (LITRE) program, the NCSU Faculty Center for Teaching and Learning, the NCSU STEM Initiative, and the Center for Advanced Computing and Communication.&lt;br /&gt;
&lt;br /&gt;
Expertiza is an open-source project with the source code available as a public repository on GitHub. It is developed using Ruby on Rails and is increasingly becoming robust thanks to the innumerable bugs being fixed by the community. The project has a micro-blog on SourceForge where the developer community report bugs and document updates.&lt;br /&gt;
&lt;br /&gt;
== '''Project Description''' ==&lt;br /&gt;
&lt;br /&gt;
1) Identifying the Expertiza pages which take time to load using Rack-mini-profiler and Flamegraphs.&lt;br /&gt;
&lt;br /&gt;
2) Propose fixes which would improve the Expertiza project.&lt;br /&gt;
&lt;br /&gt;
3) Optimizing the view, models and controllers for few of these corresponding fixes to improve the load time of these pages.&lt;br /&gt;
&lt;br /&gt;
== '''Gems Installed'''  ==&lt;br /&gt;
&lt;br /&gt;
*rack-mini-profiler :- Middleware that displays speed badge for every html page. Designed to work both in production and in development.&lt;br /&gt;
*flamegraphs :- Flame graphs are a visualization of profiled software, allowing the most frequent code-paths to be identified quickly and accurately.&lt;br /&gt;
*stackprof :- A sampling call-stack profiler for ruby 2.1+.Downloaded as a dependency for rack-mini-profiler.&lt;br /&gt;
*fast_stack :- fast_stack is dynamically resizable data structure optimized for fast iteration over the large arrays of similar elements avoiding memory fragmentation.&lt;br /&gt;
*Kaminari :- A Scope &amp;amp; Engine based, clean, powerful, customizable and sophisticated paginator for modern web app frameworks and ORMs.&lt;br /&gt;
&lt;br /&gt;
== '''Pages which needs to be optimized''' ==&lt;br /&gt;
&lt;br /&gt;
1) expertiza.ncsu.edu/grades/view?id=&amp;lt;ID of the team&amp;gt;&lt;br /&gt;
&lt;br /&gt;
2) expertiza.ncsu.edu/users/list&lt;br /&gt;
&lt;br /&gt;
== '''Project Design''' ==&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
For the purpose of this project, experts in the expertiza domain are Instructors. &lt;br /&gt;
&lt;br /&gt;
The following two patterns are implemented in the project - &lt;br /&gt;
&lt;br /&gt;
1.MVC Pattern - The project is implemented in Ruby on Rails that uses MVC architecture. It separates an application’s data model, user interface, and control logic into three distinct components (model, view, and controller, respectively). &lt;br /&gt;
&lt;br /&gt;
2.DRY Principle - We are trying to reuse the existing functionalities in Expertiza, thus avoiding code duplication. Whenever possible, code modification based on the existing classes, controllers, or tables will be done instead of creating the new one.&lt;br /&gt;
&lt;br /&gt;
3.Optimization - In order to optimize, we need to understand the factors which are causing the lag. This can be identified by using the flamegraph generation method and rack-mini-profiler statistics.&lt;br /&gt;
&lt;br /&gt;
=='''Approach'''==&lt;br /&gt;
To complete the given task, we identified the factors which are causing the lag. This was done by using flamegraph generation and rack-mini-profiler statistics. The statistics generated by rack miniprofiler helped us to understand the time taken by each component to get loaded. From these statistics, we identified the model/controller/view/database query which is causing this latency. From here, we identified the methods which needed to be implemented in order to optimize the webpage rendering.&lt;br /&gt;
&lt;br /&gt;
Optimization approach for the pages:&lt;br /&gt;
*users/list :- The approach to reduce loading time on this page was by implementing pagination. Instead of displaying all users and their data all at once, we display a certain number of users on one page, and rest of the users can be viewed by accessing the later pages. This reduces loading time of the page by reducing the amount of data to be fetched.&lt;br /&gt;
*grades/view : Ajax must be used for the optimization. Currently, all the data for all the teams present is loaded when the webpage is accessed. Instead, data for particular teams can be loaded when the user clicks on the expand button for that particular team. Thus, data for each team should be loaded asynchronously with ajax.&lt;br /&gt;
&lt;br /&gt;
== '''Analysis of the pages''' ==&lt;br /&gt;
&lt;br /&gt;
===FlameGraph Statistics===&lt;br /&gt;
The following is the flamegraph for this page:-&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:f.png]]&lt;br /&gt;
&lt;br /&gt;
The X axis of the FlameGraph represents the time taken to load the page. It can give a clear picture of where the expertiza page is getting bogged down. The widest layers take the longest to run. They’re the areas one should look into, because speeding them up could have the biggest impact. As we can see over here, most of the time taken over here is in the controller action.&lt;br /&gt;
&lt;br /&gt;
===MiniProfiler Statistics===&lt;br /&gt;
&lt;br /&gt;
The following is the rack-mini-profiler statistics for the page:-&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tre1.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
The box which is seen in the leftmost corner is the MiniProfiler statistics. MiniProfiler gives  a constant notification of how long each page takes to load. The miniprofiler statistics show the time taken to render the view as well as the corresponding SQL calls.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree2.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
This image shows the time and the number of SQL calls which are required for each rendering.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree5.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
Here as we can see the total number of SQL calls required for children_node_ng is 1123. This is causing the latency in the entire page by 10564.8 ms. These statistics helped us to identify the method which needs to be refactored.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree6.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
The total number of SQL calls required for 2 components here is 2 each. Hence we do not need to refactor this component.&lt;br /&gt;
&lt;br /&gt;
===  Solution ===&lt;br /&gt;
*'''users/list'''&lt;br /&gt;
The time taken to load the page was high because the server had to access through hundreds of rows in the database .The page was rendering the entire row of database at the same time. Pagination helped to split the database  into manageable chunks of data.&lt;br /&gt;
&lt;br /&gt;
Code added to app/controllers/users_controller.rb&lt;br /&gt;
  def list&lt;br /&gt;
    user = session[:user]&lt;br /&gt;
  	@users=Kaminari.paginate_array(user.get_user_list).page(params[:page])&lt;br /&gt;
  end&lt;br /&gt;
&lt;br /&gt;
Code added to app/models/user.rb&lt;br /&gt;
  &amp;lt;%= paginate @user %&amp;gt;&lt;br /&gt;
&lt;br /&gt;
Code added to app/views/users/list.html.erb&lt;br /&gt;
  &amp;lt;%= paginate @users %&amp;gt;&lt;br /&gt;
&lt;br /&gt;
*'''grades/view'''&lt;br /&gt;
The grades/view is the page where the instructor accesses the grades statistics of each student.&lt;br /&gt;
The reason for the slow down in the page is that the data for all the teams were loaded as soon as the page was loaded.The design of the page has an individual tab for each team, hence loading the entire data as soon as the page is loaded is quite redundant as the instructor needs to access the scores of each individual team at a given time.&lt;br /&gt;
The solution to this problem is to access the individual team statistics from the database when the instructor clicks the tab specified for the particular individual. &lt;br /&gt;
The existing code consists of a for loop in views/grades/_teams.html.erb, which renders the partial &amp;quot;views/grades/_tabbing.html.erb&amp;quot; which displays the data repeatedly. Instead, this partial could be rendered through AJAX or JQuery, whenever the expand button is clicked. This would save redundant loading of data and thus reduce the loading time of the page.&lt;br /&gt;
&lt;br /&gt;
Issues faced during implementation of this solution:- &lt;br /&gt;
&lt;br /&gt;
*While implementing this fix, we first created a controller method, which would render the required partial &amp;quot;views/grades/_tabbing.html.erb&amp;quot; when called.We also created a route for this controller method. &lt;br /&gt;
*We passed the required data through the Rails params hash. However, since one argument that needed to be passed (tscore) is a Hash, when it enters the params hash, it is getting converted to a String. &lt;br /&gt;
*We tried passing the hash as it is, but after doing this all the data in the hash is not retained, i.e. there is a loss of data.&lt;br /&gt;
*We also tried converting the String back into Hash by using the eval method, and to_unsafe_h method.&lt;br /&gt;
*However, these methods require the hash to be present in a normal form i.e. key value pairs. &lt;br /&gt;
*But our hash has values as Objects, thus these methods cannot be applied&lt;br /&gt;
*Thus, we are unable to access the data in the String-hash. &lt;br /&gt;
*If this could be done, then our approach would result in successfully decreasing the loading time of the webpage.&lt;br /&gt;
&lt;br /&gt;
=='''Test Plan'''==&lt;br /&gt;
The project is based on optimizing the time required to load the pages which has been mentioned above,in order to test that there is an improvement in the time taken to load these pages one will have to compare the initial loading time and the time taken after the code has been modified.&lt;br /&gt;
&lt;br /&gt;
===Initial Setup for testing===&lt;br /&gt;
&lt;br /&gt;
1)Clone the git repository.&lt;br /&gt;
&lt;br /&gt;
2)Go to the commit on 3rd November(name: initial setup), this is the code which is originally provided by the professor and has not been modified. It however consists of the two gems required to check the loading time.&lt;br /&gt;
&lt;br /&gt;
3)To login as instructor :-&lt;br /&gt;
Username :- instructor6&lt;br /&gt;
Password :- password&lt;br /&gt;
&lt;br /&gt;
===Testing===&lt;br /&gt;
&lt;br /&gt;
Check the time taken to load the page localhost:3000/tree_display/list on the left corner and compare the same for the latest pull. You will notice a substantial reduction in the loading time.&lt;br /&gt;
&lt;br /&gt;
===Automated Test===&lt;br /&gt;
&lt;br /&gt;
There can be no automated test for this program since the improvement in the performance is due to the inclusion of the pagination gem. &lt;br /&gt;
&lt;br /&gt;
Hence testing if the pagination gem will work is equivalent to checking if rails is working. &lt;br /&gt;
&lt;br /&gt;
As testing rails is not recommended  no automated test is added  for  changes made.&lt;/div&gt;</summary>
		<author><name>Krkulkar</name></author>
	</entry>
	<entry>
		<id>https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=113852</id>
		<title>CSC/ECE 517 Fall 2017/E17A8. Use a profiler to identify the problems / pages that take some time to load &amp; fix them</title>
		<link rel="alternate" type="text/html" href="https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=113852"/>
		<updated>2017-11-29T22:57:04Z</updated>

		<summary type="html">&lt;p&gt;Krkulkar: /* Initial Setup for testing */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;= Optimization for page loading in Expertiza =&lt;br /&gt;
&lt;br /&gt;
== '''Introduction''' ==&lt;br /&gt;
Expertiza is an online system that is used by students to view/submit assignments and review others' work. Expertiza also provides tools to visualize the scores and gauge the improvements made during the course semester. It also facilitates and monitors team projects. It is targeted at educational and non-profit organizations. The project is funded by the National Software Foundation (NSF), NCSU Learning in a Technology-Rich Environment (LITRE) program, the NCSU Faculty Center for Teaching and Learning, the NCSU STEM Initiative, and the Center for Advanced Computing and Communication.&lt;br /&gt;
&lt;br /&gt;
Expertiza is an open-source project with the source code available as a public repository on GitHub. It is developed using Ruby on Rails and is increasingly becoming robust thanks to the innumerable bugs being fixed by the community. The project has a micro-blog on SourceForge where the developer community report bugs and document updates.&lt;br /&gt;
&lt;br /&gt;
== '''Project Description''' ==&lt;br /&gt;
&lt;br /&gt;
1) Identifying the Expertiza pages which take time to load using Rack-mini-profiler and Flamegraphs.&lt;br /&gt;
&lt;br /&gt;
2) Propose fixes which would improve the Expertiza project.&lt;br /&gt;
&lt;br /&gt;
3) Optimizing the view, models and controllers for few of these corresponding fixes to improve the load time of these pages.&lt;br /&gt;
&lt;br /&gt;
== '''Gems Installed'''  ==&lt;br /&gt;
&lt;br /&gt;
*rack-mini-profiler :- Middleware that displays speed badge for every html page. Designed to work both in production and in development.&lt;br /&gt;
*flamegraphs :- Flame graphs are a visualization of profiled software, allowing the most frequent code-paths to be identified quickly and accurately.&lt;br /&gt;
*stackprof :- A sampling call-stack profiler for ruby 2.1+.Downloaded as a dependency for rack-mini-profiler.&lt;br /&gt;
*fast_stack :- fast_stack is dynamically resizable data structure optimized for fast iteration over the large arrays of similar elements avoiding memory fragmentation.&lt;br /&gt;
*Kaminari :- A Scope &amp;amp; Engine based, clean, powerful, customizable and sophisticated paginator for modern web app frameworks and ORMs.&lt;br /&gt;
&lt;br /&gt;
== '''Pages which needs to be optimized''' ==&lt;br /&gt;
&lt;br /&gt;
1) expertiza.ncsu.edu/grades/view?id=&amp;lt;ID of the team&amp;gt;&lt;br /&gt;
&lt;br /&gt;
2) expertiza.ncsu.edu/users/list&lt;br /&gt;
&lt;br /&gt;
== '''Project Design''' ==&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
For the purpose of this project, experts in the expertiza domain are Instructors. &lt;br /&gt;
&lt;br /&gt;
The following two patterns are implemented in the project - &lt;br /&gt;
&lt;br /&gt;
1.MVC Pattern - The project is implemented in Ruby on Rails that uses MVC architecture. It separates an application’s data model, user interface, and control logic into three distinct components (model, view, and controller, respectively). &lt;br /&gt;
&lt;br /&gt;
2.DRY Principle - We are trying to reuse the existing functionalities in Expertiza, thus avoiding code duplication. Whenever possible, code modification based on the existing classes, controllers, or tables will be done instead of creating the new one.&lt;br /&gt;
&lt;br /&gt;
3.Optimization - In order to optimize, we need to understand the factors which are causing the lag. This can be identified by using the flamegraph generation method and rack-mini-profiler statistics.&lt;br /&gt;
&lt;br /&gt;
=='''Approach'''==&lt;br /&gt;
To complete the given task, we identified the factors which are causing the lag. This was done by using flamegraph generation and rack-mini-profiler statistics. The statistics generated by rack miniprofiler helped us to understand the time taken by each component to get loaded. From these statistics, we identified the model/controller/view/database query which is causing this latency. From here, we identified the methods which needed to be implemented in order to optimize the webpage rendering.&lt;br /&gt;
&lt;br /&gt;
Optimization approach for the pages:&lt;br /&gt;
*users/list :- The approach to reduce loading time on this page was by implementing pagination. Instead of displaying all users and their data all at once, we display a certain number of users on one page, and rest of the users can be viewed by accessing the later pages. This reduces loading time of the page by reducing the amount of data to be fetched.&lt;br /&gt;
*grades/view : Ajax must be used for the optimization. Currently, all the data for all the teams present is loaded when the webpage is accessed. Instead, data for particular teams can be loaded when the user clicks on the expand button for that particular team. Thus, data for each team should be loaded asynchronously with ajax.&lt;br /&gt;
&lt;br /&gt;
== '''Analysis of the pages''' ==&lt;br /&gt;
&lt;br /&gt;
===FlameGraph Statistics===&lt;br /&gt;
The following is the flamegraph for this page:-&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:f.png]]&lt;br /&gt;
&lt;br /&gt;
The X axis of the FlameGraph represents the time taken to load the page. It can give a clear picture of where the expertiza page is getting bogged down. The widest layers take the longest to run. They’re the areas one should look into, because speeding them up could have the biggest impact. As we can see over here, most of the time taken over here is in the controller action.&lt;br /&gt;
&lt;br /&gt;
===MiniProfiler Statistics===&lt;br /&gt;
&lt;br /&gt;
The following is the rack-mini-profiler statistics for the page:-&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tre1.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
The box which is seen in the leftmost corner is the MiniProfiler statistics. MiniProfiler gives  a constant notification of how long each page takes to load. The miniprofiler statistics show the time taken to render the view as well as the corresponding SQL calls.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree2.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
This image shows the time and the number of SQL calls which are required for each rendering.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree5.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
Here as we can see the total number of SQL calls required for children_node_ng is 1123. This is causing the latency in the entire page by 10564.8 ms. These statistics helped us to identify the method which needs to be refactored.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree6.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
The total number of SQL calls required for 2 components here is 2 each. Hence we do not need to refactor this component.&lt;br /&gt;
&lt;br /&gt;
==  Solution ==&lt;br /&gt;
*users/list&lt;br /&gt;
The time taken to load the page was high because the server had to access through hundreds of rows in the database .The page was rendering the entire row of database at the same time. Pagination helped to split the database  into manageable chunks of data.&lt;br /&gt;
&lt;br /&gt;
*grades/view&lt;br /&gt;
The grades/view is the page where  the instructor accesses the grades statistics of each student.&lt;br /&gt;
The reason for  the slow down in the page is that the data for all the teams were loaded as soon as the page was loaded.The design of the page has an individual tab for each team, hence loading the entire data as soon as the page is loaded is quite redundant as the instructor needs to access the scores of each individual team at a given time.&lt;br /&gt;
The solution to this problem is to access the individual team statistics from the database when the instructor clicks the tab specified for the particular individual. &lt;br /&gt;
The existing code consists of a for loop in views/grades/_teams.html.erb, which renders the partial &amp;quot;views/grades/_tabbing.html.erb&amp;quot; which displays the data repeatedly. Instead, this partial could be rendered through AJAX or JQuery, whenever the expand button is clicked. This would save redundant loading of data and thus reduce the loading time of the page.&lt;br /&gt;
&lt;br /&gt;
Issues faced during implementation of this solution:- &lt;br /&gt;
&lt;br /&gt;
*While implementing this fix, we first created a controller method, which would render the required partial &amp;quot;views/grades/_tabbing.html.erb&amp;quot; when called. &lt;br /&gt;
*We passed the required data through the Rails params hash. However, since one argument that needed to be passed (tscore) is a Hash, when it enters the params hash, it is getting converted to a String. &lt;br /&gt;
*We tried passing the hash as it is, but after doing this all the data in the hash is not retained, i.e. there is a loss of data.&lt;br /&gt;
*We also tried converting the String back into Hash by using the eval method, and to_unsafe_h method.&lt;br /&gt;
*However, these methods require the hash to be present in a normal form i.e. key value pairs. &lt;br /&gt;
*But our hash has values as Objects, thus these methods cannot be applied&lt;br /&gt;
*Thus, we are unable to access the data in the String-hash. &lt;br /&gt;
*If this could be done, then our approach would result in successfully decreasing the loading time of the webpage.&lt;br /&gt;
&lt;br /&gt;
=='''Test Plan'''==&lt;br /&gt;
The project is based on optimizing the time required to load the pages which has been mentioned above,in order to test that there is an improvement in the time taken to load these pages one will have to compare the initial loading time and the time taken after the code has been modified.&lt;br /&gt;
&lt;br /&gt;
===Initial Setup for testing===&lt;br /&gt;
&lt;br /&gt;
1)Clone the git repository.&lt;br /&gt;
&lt;br /&gt;
2)Go to the commit on 3rd November(name: initial setup), this is the code which is originally provided by the professor and has not been modified. It however consists of the two gems required to check the loading time.&lt;br /&gt;
&lt;br /&gt;
3)To login as instructor :-&lt;br /&gt;
Username :- instructor6&lt;br /&gt;
Password :- password&lt;br /&gt;
&lt;br /&gt;
===Testing===&lt;br /&gt;
&lt;br /&gt;
Check the time taken to load the page localhost:3000/tree_display/list on the left corner and compare the same for the latest pull. You will notice a substantial reduction in the loading time.&lt;br /&gt;
&lt;br /&gt;
===Automated Test===&lt;br /&gt;
&lt;br /&gt;
There can be no automated test for this program since the improvement in the performance is due to the inclusion of the pagination gem. &lt;br /&gt;
&lt;br /&gt;
Hence testing if the pagination gem will work is equivalent to checking if rails is working. &lt;br /&gt;
&lt;br /&gt;
As testing rails is not recommended  no automated test is added  for  changes made.&lt;/div&gt;</summary>
		<author><name>Krkulkar</name></author>
	</entry>
	<entry>
		<id>https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=113851</id>
		<title>CSC/ECE 517 Fall 2017/E17A8. Use a profiler to identify the problems / pages that take some time to load &amp; fix them</title>
		<link rel="alternate" type="text/html" href="https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=113851"/>
		<updated>2017-11-29T22:56:51Z</updated>

		<summary type="html">&lt;p&gt;Krkulkar: /* Initial Setup for testing */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;= Optimization for page loading in Expertiza =&lt;br /&gt;
&lt;br /&gt;
== '''Introduction''' ==&lt;br /&gt;
Expertiza is an online system that is used by students to view/submit assignments and review others' work. Expertiza also provides tools to visualize the scores and gauge the improvements made during the course semester. It also facilitates and monitors team projects. It is targeted at educational and non-profit organizations. The project is funded by the National Software Foundation (NSF), NCSU Learning in a Technology-Rich Environment (LITRE) program, the NCSU Faculty Center for Teaching and Learning, the NCSU STEM Initiative, and the Center for Advanced Computing and Communication.&lt;br /&gt;
&lt;br /&gt;
Expertiza is an open-source project with the source code available as a public repository on GitHub. It is developed using Ruby on Rails and is increasingly becoming robust thanks to the innumerable bugs being fixed by the community. The project has a micro-blog on SourceForge where the developer community report bugs and document updates.&lt;br /&gt;
&lt;br /&gt;
== '''Project Description''' ==&lt;br /&gt;
&lt;br /&gt;
1) Identifying the Expertiza pages which take time to load using Rack-mini-profiler and Flamegraphs.&lt;br /&gt;
&lt;br /&gt;
2) Propose fixes which would improve the Expertiza project.&lt;br /&gt;
&lt;br /&gt;
3) Optimizing the view, models and controllers for few of these corresponding fixes to improve the load time of these pages.&lt;br /&gt;
&lt;br /&gt;
== '''Gems Installed'''  ==&lt;br /&gt;
&lt;br /&gt;
*rack-mini-profiler :- Middleware that displays speed badge for every html page. Designed to work both in production and in development.&lt;br /&gt;
*flamegraphs :- Flame graphs are a visualization of profiled software, allowing the most frequent code-paths to be identified quickly and accurately.&lt;br /&gt;
*stackprof :- A sampling call-stack profiler for ruby 2.1+.Downloaded as a dependency for rack-mini-profiler.&lt;br /&gt;
*fast_stack :- fast_stack is dynamically resizable data structure optimized for fast iteration over the large arrays of similar elements avoiding memory fragmentation.&lt;br /&gt;
*Kaminari :- A Scope &amp;amp; Engine based, clean, powerful, customizable and sophisticated paginator for modern web app frameworks and ORMs.&lt;br /&gt;
&lt;br /&gt;
== '''Pages which needs to be optimized''' ==&lt;br /&gt;
&lt;br /&gt;
1) expertiza.ncsu.edu/grades/view?id=&amp;lt;ID of the team&amp;gt;&lt;br /&gt;
&lt;br /&gt;
2) expertiza.ncsu.edu/users/list&lt;br /&gt;
&lt;br /&gt;
== '''Project Design''' ==&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
For the purpose of this project, experts in the expertiza domain are Instructors. &lt;br /&gt;
&lt;br /&gt;
The following two patterns are implemented in the project - &lt;br /&gt;
&lt;br /&gt;
1.MVC Pattern - The project is implemented in Ruby on Rails that uses MVC architecture. It separates an application’s data model, user interface, and control logic into three distinct components (model, view, and controller, respectively). &lt;br /&gt;
&lt;br /&gt;
2.DRY Principle - We are trying to reuse the existing functionalities in Expertiza, thus avoiding code duplication. Whenever possible, code modification based on the existing classes, controllers, or tables will be done instead of creating the new one.&lt;br /&gt;
&lt;br /&gt;
3.Optimization - In order to optimize, we need to understand the factors which are causing the lag. This can be identified by using the flamegraph generation method and rack-mini-profiler statistics.&lt;br /&gt;
&lt;br /&gt;
=='''Approach'''==&lt;br /&gt;
To complete the given task, we identified the factors which are causing the lag. This was done by using flamegraph generation and rack-mini-profiler statistics. The statistics generated by rack miniprofiler helped us to understand the time taken by each component to get loaded. From these statistics, we identified the model/controller/view/database query which is causing this latency. From here, we identified the methods which needed to be implemented in order to optimize the webpage rendering.&lt;br /&gt;
&lt;br /&gt;
Optimization approach for the pages:&lt;br /&gt;
*users/list :- The approach to reduce loading time on this page was by implementing pagination. Instead of displaying all users and their data all at once, we display a certain number of users on one page, and rest of the users can be viewed by accessing the later pages. This reduces loading time of the page by reducing the amount of data to be fetched.&lt;br /&gt;
*grades/view : Ajax must be used for the optimization. Currently, all the data for all the teams present is loaded when the webpage is accessed. Instead, data for particular teams can be loaded when the user clicks on the expand button for that particular team. Thus, data for each team should be loaded asynchronously with ajax.&lt;br /&gt;
&lt;br /&gt;
== '''Analysis of the pages''' ==&lt;br /&gt;
&lt;br /&gt;
===FlameGraph Statistics===&lt;br /&gt;
The following is the flamegraph for this page:-&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:f.png]]&lt;br /&gt;
&lt;br /&gt;
The X axis of the FlameGraph represents the time taken to load the page. It can give a clear picture of where the expertiza page is getting bogged down. The widest layers take the longest to run. They’re the areas one should look into, because speeding them up could have the biggest impact. As we can see over here, most of the time taken over here is in the controller action.&lt;br /&gt;
&lt;br /&gt;
===MiniProfiler Statistics===&lt;br /&gt;
&lt;br /&gt;
The following is the rack-mini-profiler statistics for the page:-&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tre1.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
The box which is seen in the leftmost corner is the MiniProfiler statistics. MiniProfiler gives  a constant notification of how long each page takes to load. The miniprofiler statistics show the time taken to render the view as well as the corresponding SQL calls.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree2.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
This image shows the time and the number of SQL calls which are required for each rendering.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree5.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
Here as we can see the total number of SQL calls required for children_node_ng is 1123. This is causing the latency in the entire page by 10564.8 ms. These statistics helped us to identify the method which needs to be refactored.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree6.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
The total number of SQL calls required for 2 components here is 2 each. Hence we do not need to refactor this component.&lt;br /&gt;
&lt;br /&gt;
==  Solution ==&lt;br /&gt;
*users/list&lt;br /&gt;
The time taken to load the page was high because the server had to access through hundreds of rows in the database .The page was rendering the entire row of database at the same time. Pagination helped to split the database  into manageable chunks of data.&lt;br /&gt;
&lt;br /&gt;
*grades/view&lt;br /&gt;
The grades/view is the page where  the instructor accesses the grades statistics of each student.&lt;br /&gt;
The reason for  the slow down in the page is that the data for all the teams were loaded as soon as the page was loaded.The design of the page has an individual tab for each team, hence loading the entire data as soon as the page is loaded is quite redundant as the instructor needs to access the scores of each individual team at a given time.&lt;br /&gt;
The solution to this problem is to access the individual team statistics from the database when the instructor clicks the tab specified for the particular individual. &lt;br /&gt;
The existing code consists of a for loop in views/grades/_teams.html.erb, which renders the partial &amp;quot;views/grades/_tabbing.html.erb&amp;quot; which displays the data repeatedly. Instead, this partial could be rendered through AJAX or JQuery, whenever the expand button is clicked. This would save redundant loading of data and thus reduce the loading time of the page.&lt;br /&gt;
&lt;br /&gt;
Issues faced during implementation of this solution:- &lt;br /&gt;
&lt;br /&gt;
*While implementing this fix, we first created a controller method, which would render the required partial &amp;quot;views/grades/_tabbing.html.erb&amp;quot; when called. &lt;br /&gt;
*We passed the required data through the Rails params hash. However, since one argument that needed to be passed (tscore) is a Hash, when it enters the params hash, it is getting converted to a String. &lt;br /&gt;
*We tried passing the hash as it is, but after doing this all the data in the hash is not retained, i.e. there is a loss of data.&lt;br /&gt;
*We also tried converting the String back into Hash by using the eval method, and to_unsafe_h method.&lt;br /&gt;
*However, these methods require the hash to be present in a normal form i.e. key value pairs. &lt;br /&gt;
*But our hash has values as Objects, thus these methods cannot be applied&lt;br /&gt;
*Thus, we are unable to access the data in the String-hash. &lt;br /&gt;
*If this could be done, then our approach would result in successfully decreasing the loading time of the webpage.&lt;br /&gt;
&lt;br /&gt;
=='''Test Plan'''==&lt;br /&gt;
The project is based on optimizing the time required to load the pages which has been mentioned above,in order to test that there is an improvement in the time taken to load these pages one will have to compare the initial loading time and the time taken after the code has been modified.&lt;br /&gt;
&lt;br /&gt;
===Initial Setup for testing===&lt;br /&gt;
&lt;br /&gt;
1)Clone the git repository.&lt;br /&gt;
&lt;br /&gt;
2)Go to the commit on 3rd November(name: initial setup), this is the code which is originally provided by the professor and has not been modified. It however consists of the two gems required to check the loading time.&lt;br /&gt;
&lt;br /&gt;
3)To login as instructor :-&lt;br /&gt;
USERNAME :- instructor6&lt;br /&gt;
Password:- password&lt;br /&gt;
&lt;br /&gt;
===Testing===&lt;br /&gt;
&lt;br /&gt;
Check the time taken to load the page localhost:3000/tree_display/list on the left corner and compare the same for the latest pull. You will notice a substantial reduction in the loading time.&lt;br /&gt;
&lt;br /&gt;
===Automated Test===&lt;br /&gt;
&lt;br /&gt;
There can be no automated test for this program since the improvement in the performance is due to the inclusion of the pagination gem. &lt;br /&gt;
&lt;br /&gt;
Hence testing if the pagination gem will work is equivalent to checking if rails is working. &lt;br /&gt;
&lt;br /&gt;
As testing rails is not recommended  no automated test is added  for  changes made.&lt;/div&gt;</summary>
		<author><name>Krkulkar</name></author>
	</entry>
	<entry>
		<id>https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=113850</id>
		<title>CSC/ECE 517 Fall 2017/E17A8. Use a profiler to identify the problems / pages that take some time to load &amp; fix them</title>
		<link rel="alternate" type="text/html" href="https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=113850"/>
		<updated>2017-11-29T22:56:37Z</updated>

		<summary type="html">&lt;p&gt;Krkulkar: /* Test Plan */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;= Optimization for page loading in Expertiza =&lt;br /&gt;
&lt;br /&gt;
== '''Introduction''' ==&lt;br /&gt;
Expertiza is an online system that is used by students to view/submit assignments and review others' work. Expertiza also provides tools to visualize the scores and gauge the improvements made during the course semester. It also facilitates and monitors team projects. It is targeted at educational and non-profit organizations. The project is funded by the National Software Foundation (NSF), NCSU Learning in a Technology-Rich Environment (LITRE) program, the NCSU Faculty Center for Teaching and Learning, the NCSU STEM Initiative, and the Center for Advanced Computing and Communication.&lt;br /&gt;
&lt;br /&gt;
Expertiza is an open-source project with the source code available as a public repository on GitHub. It is developed using Ruby on Rails and is increasingly becoming robust thanks to the innumerable bugs being fixed by the community. The project has a micro-blog on SourceForge where the developer community report bugs and document updates.&lt;br /&gt;
&lt;br /&gt;
== '''Project Description''' ==&lt;br /&gt;
&lt;br /&gt;
1) Identifying the Expertiza pages which take time to load using Rack-mini-profiler and Flamegraphs.&lt;br /&gt;
&lt;br /&gt;
2) Propose fixes which would improve the Expertiza project.&lt;br /&gt;
&lt;br /&gt;
3) Optimizing the view, models and controllers for few of these corresponding fixes to improve the load time of these pages.&lt;br /&gt;
&lt;br /&gt;
== '''Gems Installed'''  ==&lt;br /&gt;
&lt;br /&gt;
*rack-mini-profiler :- Middleware that displays speed badge for every html page. Designed to work both in production and in development.&lt;br /&gt;
*flamegraphs :- Flame graphs are a visualization of profiled software, allowing the most frequent code-paths to be identified quickly and accurately.&lt;br /&gt;
*stackprof :- A sampling call-stack profiler for ruby 2.1+.Downloaded as a dependency for rack-mini-profiler.&lt;br /&gt;
*fast_stack :- fast_stack is dynamically resizable data structure optimized for fast iteration over the large arrays of similar elements avoiding memory fragmentation.&lt;br /&gt;
*Kaminari :- A Scope &amp;amp; Engine based, clean, powerful, customizable and sophisticated paginator for modern web app frameworks and ORMs.&lt;br /&gt;
&lt;br /&gt;
== '''Pages which needs to be optimized''' ==&lt;br /&gt;
&lt;br /&gt;
1) expertiza.ncsu.edu/grades/view?id=&amp;lt;ID of the team&amp;gt;&lt;br /&gt;
&lt;br /&gt;
2) expertiza.ncsu.edu/users/list&lt;br /&gt;
&lt;br /&gt;
== '''Project Design''' ==&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
For the purpose of this project, experts in the expertiza domain are Instructors. &lt;br /&gt;
&lt;br /&gt;
The following two patterns are implemented in the project - &lt;br /&gt;
&lt;br /&gt;
1.MVC Pattern - The project is implemented in Ruby on Rails that uses MVC architecture. It separates an application’s data model, user interface, and control logic into three distinct components (model, view, and controller, respectively). &lt;br /&gt;
&lt;br /&gt;
2.DRY Principle - We are trying to reuse the existing functionalities in Expertiza, thus avoiding code duplication. Whenever possible, code modification based on the existing classes, controllers, or tables will be done instead of creating the new one.&lt;br /&gt;
&lt;br /&gt;
3.Optimization - In order to optimize, we need to understand the factors which are causing the lag. This can be identified by using the flamegraph generation method and rack-mini-profiler statistics.&lt;br /&gt;
&lt;br /&gt;
=='''Approach'''==&lt;br /&gt;
To complete the given task, we identified the factors which are causing the lag. This was done by using flamegraph generation and rack-mini-profiler statistics. The statistics generated by rack miniprofiler helped us to understand the time taken by each component to get loaded. From these statistics, we identified the model/controller/view/database query which is causing this latency. From here, we identified the methods which needed to be implemented in order to optimize the webpage rendering.&lt;br /&gt;
&lt;br /&gt;
Optimization approach for the pages:&lt;br /&gt;
*users/list :- The approach to reduce loading time on this page was by implementing pagination. Instead of displaying all users and their data all at once, we display a certain number of users on one page, and rest of the users can be viewed by accessing the later pages. This reduces loading time of the page by reducing the amount of data to be fetched.&lt;br /&gt;
*grades/view : Ajax must be used for the optimization. Currently, all the data for all the teams present is loaded when the webpage is accessed. Instead, data for particular teams can be loaded when the user clicks on the expand button for that particular team. Thus, data for each team should be loaded asynchronously with ajax.&lt;br /&gt;
&lt;br /&gt;
== '''Analysis of the pages''' ==&lt;br /&gt;
&lt;br /&gt;
===FlameGraph Statistics===&lt;br /&gt;
The following is the flamegraph for this page:-&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:f.png]]&lt;br /&gt;
&lt;br /&gt;
The X axis of the FlameGraph represents the time taken to load the page. It can give a clear picture of where the expertiza page is getting bogged down. The widest layers take the longest to run. They’re the areas one should look into, because speeding them up could have the biggest impact. As we can see over here, most of the time taken over here is in the controller action.&lt;br /&gt;
&lt;br /&gt;
===MiniProfiler Statistics===&lt;br /&gt;
&lt;br /&gt;
The following is the rack-mini-profiler statistics for the page:-&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tre1.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
The box which is seen in the leftmost corner is the MiniProfiler statistics. MiniProfiler gives  a constant notification of how long each page takes to load. The miniprofiler statistics show the time taken to render the view as well as the corresponding SQL calls.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree2.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
This image shows the time and the number of SQL calls which are required for each rendering.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree5.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
Here as we can see the total number of SQL calls required for children_node_ng is 1123. This is causing the latency in the entire page by 10564.8 ms. These statistics helped us to identify the method which needs to be refactored.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree6.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
The total number of SQL calls required for 2 components here is 2 each. Hence we do not need to refactor this component.&lt;br /&gt;
&lt;br /&gt;
==  Solution ==&lt;br /&gt;
*users/list&lt;br /&gt;
The time taken to load the page was high because the server had to access through hundreds of rows in the database .The page was rendering the entire row of database at the same time. Pagination helped to split the database  into manageable chunks of data.&lt;br /&gt;
&lt;br /&gt;
*grades/view&lt;br /&gt;
The grades/view is the page where  the instructor accesses the grades statistics of each student.&lt;br /&gt;
The reason for  the slow down in the page is that the data for all the teams were loaded as soon as the page was loaded.The design of the page has an individual tab for each team, hence loading the entire data as soon as the page is loaded is quite redundant as the instructor needs to access the scores of each individual team at a given time.&lt;br /&gt;
The solution to this problem is to access the individual team statistics from the database when the instructor clicks the tab specified for the particular individual. &lt;br /&gt;
The existing code consists of a for loop in views/grades/_teams.html.erb, which renders the partial &amp;quot;views/grades/_tabbing.html.erb&amp;quot; which displays the data repeatedly. Instead, this partial could be rendered through AJAX or JQuery, whenever the expand button is clicked. This would save redundant loading of data and thus reduce the loading time of the page.&lt;br /&gt;
&lt;br /&gt;
Issues faced during implementation of this solution:- &lt;br /&gt;
&lt;br /&gt;
*While implementing this fix, we first created a controller method, which would render the required partial &amp;quot;views/grades/_tabbing.html.erb&amp;quot; when called. &lt;br /&gt;
*We passed the required data through the Rails params hash. However, since one argument that needed to be passed (tscore) is a Hash, when it enters the params hash, it is getting converted to a String. &lt;br /&gt;
*We tried passing the hash as it is, but after doing this all the data in the hash is not retained, i.e. there is a loss of data.&lt;br /&gt;
*We also tried converting the String back into Hash by using the eval method, and to_unsafe_h method.&lt;br /&gt;
*However, these methods require the hash to be present in a normal form i.e. key value pairs. &lt;br /&gt;
*But our hash has values as Objects, thus these methods cannot be applied&lt;br /&gt;
*Thus, we are unable to access the data in the String-hash. &lt;br /&gt;
*If this could be done, then our approach would result in successfully decreasing the loading time of the webpage.&lt;br /&gt;
&lt;br /&gt;
=='''Test Plan'''==&lt;br /&gt;
The project is based on optimizing the time required to load the pages which has been mentioned above,in order to test that there is an improvement in the time taken to load these pages one will have to compare the initial loading time and the time taken after the code has been modified.&lt;br /&gt;
&lt;br /&gt;
===Initial Setup for testing===&lt;br /&gt;
&lt;br /&gt;
1)Clone the git repository.&lt;br /&gt;
&lt;br /&gt;
2)Go to the commit on 3rd November(name: initial setup),this is the code which is originally provided by the professor and has not been modified. It however consists of the two gems required to check the loading time.&lt;br /&gt;
&lt;br /&gt;
3)To login as instructor :-&lt;br /&gt;
USERNAME :- instructor6&lt;br /&gt;
Password:- password&lt;br /&gt;
&lt;br /&gt;
===Testing===&lt;br /&gt;
&lt;br /&gt;
Check the time taken to load the page localhost:3000/tree_display/list on the left corner and compare the same for the latest pull. You will notice a substantial reduction in the loading time.&lt;br /&gt;
&lt;br /&gt;
===Automated Test===&lt;br /&gt;
&lt;br /&gt;
There can be no automated test for this program since the improvement in the performance is due to the inclusion of the pagination gem. &lt;br /&gt;
&lt;br /&gt;
Hence testing if the pagination gem will work is equivalent to checking if rails is working. &lt;br /&gt;
&lt;br /&gt;
As testing rails is not recommended  no automated test is added  for  changes made.&lt;/div&gt;</summary>
		<author><name>Krkulkar</name></author>
	</entry>
	<entry>
		<id>https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=113849</id>
		<title>CSC/ECE 517 Fall 2017/E17A8. Use a profiler to identify the problems / pages that take some time to load &amp; fix them</title>
		<link rel="alternate" type="text/html" href="https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=113849"/>
		<updated>2017-11-29T22:56:11Z</updated>

		<summary type="html">&lt;p&gt;Krkulkar: /* Analysis of the page expertiza.ncsu.edu/tree_display/list */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;= Optimization for page loading in Expertiza =&lt;br /&gt;
&lt;br /&gt;
== '''Introduction''' ==&lt;br /&gt;
Expertiza is an online system that is used by students to view/submit assignments and review others' work. Expertiza also provides tools to visualize the scores and gauge the improvements made during the course semester. It also facilitates and monitors team projects. It is targeted at educational and non-profit organizations. The project is funded by the National Software Foundation (NSF), NCSU Learning in a Technology-Rich Environment (LITRE) program, the NCSU Faculty Center for Teaching and Learning, the NCSU STEM Initiative, and the Center for Advanced Computing and Communication.&lt;br /&gt;
&lt;br /&gt;
Expertiza is an open-source project with the source code available as a public repository on GitHub. It is developed using Ruby on Rails and is increasingly becoming robust thanks to the innumerable bugs being fixed by the community. The project has a micro-blog on SourceForge where the developer community report bugs and document updates.&lt;br /&gt;
&lt;br /&gt;
== '''Project Description''' ==&lt;br /&gt;
&lt;br /&gt;
1) Identifying the Expertiza pages which take time to load using Rack-mini-profiler and Flamegraphs.&lt;br /&gt;
&lt;br /&gt;
2) Propose fixes which would improve the Expertiza project.&lt;br /&gt;
&lt;br /&gt;
3) Optimizing the view, models and controllers for few of these corresponding fixes to improve the load time of these pages.&lt;br /&gt;
&lt;br /&gt;
== '''Gems Installed'''  ==&lt;br /&gt;
&lt;br /&gt;
*rack-mini-profiler :- Middleware that displays speed badge for every html page. Designed to work both in production and in development.&lt;br /&gt;
*flamegraphs :- Flame graphs are a visualization of profiled software, allowing the most frequent code-paths to be identified quickly and accurately.&lt;br /&gt;
*stackprof :- A sampling call-stack profiler for ruby 2.1+.Downloaded as a dependency for rack-mini-profiler.&lt;br /&gt;
*fast_stack :- fast_stack is dynamically resizable data structure optimized for fast iteration over the large arrays of similar elements avoiding memory fragmentation.&lt;br /&gt;
*Kaminari :- A Scope &amp;amp; Engine based, clean, powerful, customizable and sophisticated paginator for modern web app frameworks and ORMs.&lt;br /&gt;
&lt;br /&gt;
== '''Pages which needs to be optimized''' ==&lt;br /&gt;
&lt;br /&gt;
1) expertiza.ncsu.edu/grades/view?id=&amp;lt;ID of the team&amp;gt;&lt;br /&gt;
&lt;br /&gt;
2) expertiza.ncsu.edu/users/list&lt;br /&gt;
&lt;br /&gt;
== '''Project Design''' ==&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
For the purpose of this project, experts in the expertiza domain are Instructors. &lt;br /&gt;
&lt;br /&gt;
The following two patterns are implemented in the project - &lt;br /&gt;
&lt;br /&gt;
1.MVC Pattern - The project is implemented in Ruby on Rails that uses MVC architecture. It separates an application’s data model, user interface, and control logic into three distinct components (model, view, and controller, respectively). &lt;br /&gt;
&lt;br /&gt;
2.DRY Principle - We are trying to reuse the existing functionalities in Expertiza, thus avoiding code duplication. Whenever possible, code modification based on the existing classes, controllers, or tables will be done instead of creating the new one.&lt;br /&gt;
&lt;br /&gt;
3.Optimization - In order to optimize, we need to understand the factors which are causing the lag. This can be identified by using the flamegraph generation method and rack-mini-profiler statistics.&lt;br /&gt;
&lt;br /&gt;
=='''Approach'''==&lt;br /&gt;
To complete the given task, we identified the factors which are causing the lag. This was done by using flamegraph generation and rack-mini-profiler statistics. The statistics generated by rack miniprofiler helped us to understand the time taken by each component to get loaded. From these statistics, we identified the model/controller/view/database query which is causing this latency. From here, we identified the methods which needed to be implemented in order to optimize the webpage rendering.&lt;br /&gt;
&lt;br /&gt;
Optimization approach for the pages:&lt;br /&gt;
*users/list :- The approach to reduce loading time on this page was by implementing pagination. Instead of displaying all users and their data all at once, we display a certain number of users on one page, and rest of the users can be viewed by accessing the later pages. This reduces loading time of the page by reducing the amount of data to be fetched.&lt;br /&gt;
*grades/view : Ajax must be used for the optimization. Currently, all the data for all the teams present is loaded when the webpage is accessed. Instead, data for particular teams can be loaded when the user clicks on the expand button for that particular team. Thus, data for each team should be loaded asynchronously with ajax.&lt;br /&gt;
&lt;br /&gt;
== '''Analysis of the pages''' ==&lt;br /&gt;
&lt;br /&gt;
===FlameGraph Statistics===&lt;br /&gt;
The following is the flamegraph for this page:-&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:f.png]]&lt;br /&gt;
&lt;br /&gt;
The X axis of the FlameGraph represents the time taken to load the page. It can give a clear picture of where the expertiza page is getting bogged down. The widest layers take the longest to run. They’re the areas one should look into, because speeding them up could have the biggest impact. As we can see over here, most of the time taken over here is in the controller action.&lt;br /&gt;
&lt;br /&gt;
===MiniProfiler Statistics===&lt;br /&gt;
&lt;br /&gt;
The following is the rack-mini-profiler statistics for the page:-&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tre1.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
The box which is seen in the leftmost corner is the MiniProfiler statistics. MiniProfiler gives  a constant notification of how long each page takes to load. The miniprofiler statistics show the time taken to render the view as well as the corresponding SQL calls.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree2.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
This image shows the time and the number of SQL calls which are required for each rendering.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree5.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
Here as we can see the total number of SQL calls required for children_node_ng is 1123. This is causing the latency in the entire page by 10564.8 ms. These statistics helped us to identify the method which needs to be refactored.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree6.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
The total number of SQL calls required for 2 components here is 2 each. Hence we do not need to refactor this component.&lt;br /&gt;
&lt;br /&gt;
==  Solution ==&lt;br /&gt;
*users/list&lt;br /&gt;
The time taken to load the page was high because the server had to access through hundreds of rows in the database .The page was rendering the entire row of database at the same time. Pagination helped to split the database  into manageable chunks of data.&lt;br /&gt;
&lt;br /&gt;
*grades/view&lt;br /&gt;
The grades/view is the page where  the instructor accesses the grades statistics of each student.&lt;br /&gt;
The reason for  the slow down in the page is that the data for all the teams were loaded as soon as the page was loaded.The design of the page has an individual tab for each team, hence loading the entire data as soon as the page is loaded is quite redundant as the instructor needs to access the scores of each individual team at a given time.&lt;br /&gt;
The solution to this problem is to access the individual team statistics from the database when the instructor clicks the tab specified for the particular individual. &lt;br /&gt;
The existing code consists of a for loop in views/grades/_teams.html.erb, which renders the partial &amp;quot;views/grades/_tabbing.html.erb&amp;quot; which displays the data repeatedly. Instead, this partial could be rendered through AJAX or JQuery, whenever the expand button is clicked. This would save redundant loading of data and thus reduce the loading time of the page.&lt;br /&gt;
&lt;br /&gt;
Issues faced during implementation of this solution:- &lt;br /&gt;
&lt;br /&gt;
*While implementing this fix, we first created a controller method, which would render the required partial &amp;quot;views/grades/_tabbing.html.erb&amp;quot; when called. &lt;br /&gt;
*We passed the required data through the Rails params hash. However, since one argument that needed to be passed (tscore) is a Hash, when it enters the params hash, it is getting converted to a String. &lt;br /&gt;
*We tried passing the hash as it is, but after doing this all the data in the hash is not retained, i.e. there is a loss of data.&lt;br /&gt;
*We also tried converting the String back into Hash by using the eval method, and to_unsafe_h method.&lt;br /&gt;
*However, these methods require the hash to be present in a normal form i.e. key value pairs. &lt;br /&gt;
*But our hash has values as Objects, thus these methods cannot be applied&lt;br /&gt;
*Thus, we are unable to access the data in the String-hash. &lt;br /&gt;
*If this could be done, then our approach would result in successfully decreasing the loading time of the webpage.&lt;br /&gt;
&lt;br /&gt;
==Test Plan==&lt;br /&gt;
The project is based on optimizing the time required to load the pages which has been mentioned above,in order to test that there is an improvement in the time taken to load these pages one will have to compare the initial loading time and the time taken after the code has been modified.&lt;br /&gt;
&lt;br /&gt;
===Initial Setup for testing===&lt;br /&gt;
&lt;br /&gt;
1)Clone the git repository.&lt;br /&gt;
&lt;br /&gt;
2)Go to the commit on 3rd November(name: initial setup),this is the code which is originally provided by the professor and has not been modified. It however consists of the two gems required to check the loading time.&lt;br /&gt;
&lt;br /&gt;
3)To login as instructor :-&lt;br /&gt;
USERNAME :- instructor6&lt;br /&gt;
Password:- password&lt;br /&gt;
&lt;br /&gt;
===Testing===&lt;br /&gt;
&lt;br /&gt;
Check the time taken to load the page localhost:3000/tree_display/list on the left corner and compare the same for the latest pull. You will notice a substantial reduction in the loading time.&lt;br /&gt;
&lt;br /&gt;
===Automated Test===&lt;br /&gt;
&lt;br /&gt;
There can be no automated test for this program since the improvement in the performance is due to the inclusion of the pagination gem. &lt;br /&gt;
&lt;br /&gt;
Hence testing if the pagination gem will work is equivalent to checking if rails is working. &lt;br /&gt;
&lt;br /&gt;
As testing rails is not recommended  no automated test is added  for  changes made.&lt;/div&gt;</summary>
		<author><name>Krkulkar</name></author>
	</entry>
	<entry>
		<id>https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=113848</id>
		<title>CSC/ECE 517 Fall 2017/E17A8. Use a profiler to identify the problems / pages that take some time to load &amp; fix them</title>
		<link rel="alternate" type="text/html" href="https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=113848"/>
		<updated>2017-11-29T22:55:54Z</updated>

		<summary type="html">&lt;p&gt;Krkulkar: /* Identification of pages */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;= Optimization for page loading in Expertiza =&lt;br /&gt;
&lt;br /&gt;
== '''Introduction''' ==&lt;br /&gt;
Expertiza is an online system that is used by students to view/submit assignments and review others' work. Expertiza also provides tools to visualize the scores and gauge the improvements made during the course semester. It also facilitates and monitors team projects. It is targeted at educational and non-profit organizations. The project is funded by the National Software Foundation (NSF), NCSU Learning in a Technology-Rich Environment (LITRE) program, the NCSU Faculty Center for Teaching and Learning, the NCSU STEM Initiative, and the Center for Advanced Computing and Communication.&lt;br /&gt;
&lt;br /&gt;
Expertiza is an open-source project with the source code available as a public repository on GitHub. It is developed using Ruby on Rails and is increasingly becoming robust thanks to the innumerable bugs being fixed by the community. The project has a micro-blog on SourceForge where the developer community report bugs and document updates.&lt;br /&gt;
&lt;br /&gt;
== '''Project Description''' ==&lt;br /&gt;
&lt;br /&gt;
1) Identifying the Expertiza pages which take time to load using Rack-mini-profiler and Flamegraphs.&lt;br /&gt;
&lt;br /&gt;
2) Propose fixes which would improve the Expertiza project.&lt;br /&gt;
&lt;br /&gt;
3) Optimizing the view, models and controllers for few of these corresponding fixes to improve the load time of these pages.&lt;br /&gt;
&lt;br /&gt;
== '''Gems Installed'''  ==&lt;br /&gt;
&lt;br /&gt;
*rack-mini-profiler :- Middleware that displays speed badge for every html page. Designed to work both in production and in development.&lt;br /&gt;
*flamegraphs :- Flame graphs are a visualization of profiled software, allowing the most frequent code-paths to be identified quickly and accurately.&lt;br /&gt;
*stackprof :- A sampling call-stack profiler for ruby 2.1+.Downloaded as a dependency for rack-mini-profiler.&lt;br /&gt;
*fast_stack :- fast_stack is dynamically resizable data structure optimized for fast iteration over the large arrays of similar elements avoiding memory fragmentation.&lt;br /&gt;
*Kaminari :- A Scope &amp;amp; Engine based, clean, powerful, customizable and sophisticated paginator for modern web app frameworks and ORMs.&lt;br /&gt;
&lt;br /&gt;
== '''Pages which needs to be optimized''' ==&lt;br /&gt;
&lt;br /&gt;
1) expertiza.ncsu.edu/grades/view?id=&amp;lt;ID of the team&amp;gt;&lt;br /&gt;
&lt;br /&gt;
2) expertiza.ncsu.edu/users/list&lt;br /&gt;
&lt;br /&gt;
== '''Project Design''' ==&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
For the purpose of this project, experts in the expertiza domain are Instructors. &lt;br /&gt;
&lt;br /&gt;
The following two patterns are implemented in the project - &lt;br /&gt;
&lt;br /&gt;
1.MVC Pattern - The project is implemented in Ruby on Rails that uses MVC architecture. It separates an application’s data model, user interface, and control logic into three distinct components (model, view, and controller, respectively). &lt;br /&gt;
&lt;br /&gt;
2.DRY Principle - We are trying to reuse the existing functionalities in Expertiza, thus avoiding code duplication. Whenever possible, code modification based on the existing classes, controllers, or tables will be done instead of creating the new one.&lt;br /&gt;
&lt;br /&gt;
3.Optimization - In order to optimize, we need to understand the factors which are causing the lag. This can be identified by using the flamegraph generation method and rack-mini-profiler statistics.&lt;br /&gt;
&lt;br /&gt;
=='''Approach'''==&lt;br /&gt;
To complete the given task, we identified the factors which are causing the lag. This was done by using flamegraph generation and rack-mini-profiler statistics. The statistics generated by rack miniprofiler helped us to understand the time taken by each component to get loaded. From these statistics, we identified the model/controller/view/database query which is causing this latency. From here, we identified the methods which needed to be implemented in order to optimize the webpage rendering.&lt;br /&gt;
&lt;br /&gt;
Optimization approach for the pages:&lt;br /&gt;
*users/list :- The approach to reduce loading time on this page was by implementing pagination. Instead of displaying all users and their data all at once, we display a certain number of users on one page, and rest of the users can be viewed by accessing the later pages. This reduces loading time of the page by reducing the amount of data to be fetched.&lt;br /&gt;
*grades/view : Ajax must be used for the optimization. Currently, all the data for all the teams present is loaded when the webpage is accessed. Instead, data for particular teams can be loaded when the user clicks on the expand button for that particular team. Thus, data for each team should be loaded asynchronously with ajax.&lt;br /&gt;
&lt;br /&gt;
== '''Analysis of the page expertiza.ncsu.edu/tree_display/list''' ==&lt;br /&gt;
&lt;br /&gt;
===FlameGraph Statistics===&lt;br /&gt;
The following is the flamegraph for this page:-&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:f.png]]&lt;br /&gt;
&lt;br /&gt;
The X axis of the FlameGraph represents the time taken to load the page. It can give a clear picture of where the expertiza page is getting bogged down. The widest layers take the longest to run. They’re the areas one should look into, because speeding them up could have the biggest impact. As we can see over here, most of the time taken over here is in the controller action.&lt;br /&gt;
&lt;br /&gt;
===MiniProfiler Statistics===&lt;br /&gt;
&lt;br /&gt;
The following is the rack-mini-profiler statistics for the page:-&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tre1.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
The box which is seen in the leftmost corner is the MiniProfiler statistics. MiniProfiler gives  a constant notification of how long each page takes to load. The miniprofiler statistics show the time taken to render the view as well as the corresponding SQL calls.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree2.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
This image shows the time and the number of SQL calls which are required for each rendering.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree5.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
Here as we can see the total number of SQL calls required for children_node_ng is 1123. This is causing the latency in the entire page by 10564.8 ms. These statistics helped us to identify the method which needs to be refactored.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree6.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
The total number of SQL calls required for 2 components here is 2 each. Hence we do not need to refactor this component.&lt;br /&gt;
&lt;br /&gt;
==  Solution ==&lt;br /&gt;
*users/list&lt;br /&gt;
The time taken to load the page was high because the server had to access through hundreds of rows in the database .The page was rendering the entire row of database at the same time. Pagination helped to split the database  into manageable chunks of data.&lt;br /&gt;
&lt;br /&gt;
*grades/view&lt;br /&gt;
The grades/view is the page where  the instructor accesses the grades statistics of each student.&lt;br /&gt;
The reason for  the slow down in the page is that the data for all the teams were loaded as soon as the page was loaded.The design of the page has an individual tab for each team, hence loading the entire data as soon as the page is loaded is quite redundant as the instructor needs to access the scores of each individual team at a given time.&lt;br /&gt;
The solution to this problem is to access the individual team statistics from the database when the instructor clicks the tab specified for the particular individual. &lt;br /&gt;
The existing code consists of a for loop in views/grades/_teams.html.erb, which renders the partial &amp;quot;views/grades/_tabbing.html.erb&amp;quot; which displays the data repeatedly. Instead, this partial could be rendered through AJAX or JQuery, whenever the expand button is clicked. This would save redundant loading of data and thus reduce the loading time of the page.&lt;br /&gt;
&lt;br /&gt;
Issues faced during implementation of this solution:- &lt;br /&gt;
&lt;br /&gt;
*While implementing this fix, we first created a controller method, which would render the required partial &amp;quot;views/grades/_tabbing.html.erb&amp;quot; when called. &lt;br /&gt;
*We passed the required data through the Rails params hash. However, since one argument that needed to be passed (tscore) is a Hash, when it enters the params hash, it is getting converted to a String. &lt;br /&gt;
*We tried passing the hash as it is, but after doing this all the data in the hash is not retained, i.e. there is a loss of data.&lt;br /&gt;
*We also tried converting the String back into Hash by using the eval method, and to_unsafe_h method.&lt;br /&gt;
*However, these methods require the hash to be present in a normal form i.e. key value pairs. &lt;br /&gt;
*But our hash has values as Objects, thus these methods cannot be applied&lt;br /&gt;
*Thus, we are unable to access the data in the String-hash. &lt;br /&gt;
*If this could be done, then our approach would result in successfully decreasing the loading time of the webpage.&lt;br /&gt;
&lt;br /&gt;
==Test Plan==&lt;br /&gt;
The project is based on optimizing the time required to load the pages which has been mentioned above,in order to test that there is an improvement in the time taken to load these pages one will have to compare the initial loading time and the time taken after the code has been modified.&lt;br /&gt;
&lt;br /&gt;
===Initial Setup for testing===&lt;br /&gt;
&lt;br /&gt;
1)Clone the git repository.&lt;br /&gt;
&lt;br /&gt;
2)Go to the commit on 3rd November(name: initial setup),this is the code which is originally provided by the professor and has not been modified. It however consists of the two gems required to check the loading time.&lt;br /&gt;
&lt;br /&gt;
3)To login as instructor :-&lt;br /&gt;
USERNAME :- instructor6&lt;br /&gt;
Password:- password&lt;br /&gt;
&lt;br /&gt;
===Testing===&lt;br /&gt;
&lt;br /&gt;
Check the time taken to load the page localhost:3000/tree_display/list on the left corner and compare the same for the latest pull. You will notice a substantial reduction in the loading time.&lt;br /&gt;
&lt;br /&gt;
===Automated Test===&lt;br /&gt;
&lt;br /&gt;
There can be no automated test for this program since the improvement in the performance is due to the inclusion of the pagination gem. &lt;br /&gt;
&lt;br /&gt;
Hence testing if the pagination gem will work is equivalent to checking if rails is working. &lt;br /&gt;
&lt;br /&gt;
As testing rails is not recommended  no automated test is added  for  changes made.&lt;/div&gt;</summary>
		<author><name>Krkulkar</name></author>
	</entry>
	<entry>
		<id>https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=113847</id>
		<title>CSC/ECE 517 Fall 2017/E17A8. Use a profiler to identify the problems / pages that take some time to load &amp; fix them</title>
		<link rel="alternate" type="text/html" href="https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=113847"/>
		<updated>2017-11-29T22:54:46Z</updated>

		<summary type="html">&lt;p&gt;Krkulkar: /* Identification of pages */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;= Optimization for page loading in Expertiza =&lt;br /&gt;
&lt;br /&gt;
== '''Introduction''' ==&lt;br /&gt;
Expertiza is an online system that is used by students to view/submit assignments and review others' work. Expertiza also provides tools to visualize the scores and gauge the improvements made during the course semester. It also facilitates and monitors team projects. It is targeted at educational and non-profit organizations. The project is funded by the National Software Foundation (NSF), NCSU Learning in a Technology-Rich Environment (LITRE) program, the NCSU Faculty Center for Teaching and Learning, the NCSU STEM Initiative, and the Center for Advanced Computing and Communication.&lt;br /&gt;
&lt;br /&gt;
Expertiza is an open-source project with the source code available as a public repository on GitHub. It is developed using Ruby on Rails and is increasingly becoming robust thanks to the innumerable bugs being fixed by the community. The project has a micro-blog on SourceForge where the developer community report bugs and document updates.&lt;br /&gt;
&lt;br /&gt;
== '''Project Description''' ==&lt;br /&gt;
&lt;br /&gt;
1) Identifying the Expertiza pages which take time to load using Rack-mini-profiler and Flamegraphs.&lt;br /&gt;
&lt;br /&gt;
2) Propose fixes which would improve the Expertiza project.&lt;br /&gt;
&lt;br /&gt;
3) Optimizing the view, models and controllers for few of these corresponding fixes to improve the load time of these pages.&lt;br /&gt;
&lt;br /&gt;
== '''Gems Installed'''  ==&lt;br /&gt;
&lt;br /&gt;
*rack-mini-profiler :- Middleware that displays speed badge for every html page. Designed to work both in production and in development.&lt;br /&gt;
*flamegraphs :- Flame graphs are a visualization of profiled software, allowing the most frequent code-paths to be identified quickly and accurately.&lt;br /&gt;
*stackprof :- A sampling call-stack profiler for ruby 2.1+.Downloaded as a dependency for rack-mini-profiler.&lt;br /&gt;
*fast_stack :- fast_stack is dynamically resizable data structure optimized for fast iteration over the large arrays of similar elements avoiding memory fragmentation.&lt;br /&gt;
*Kaminari :- A Scope &amp;amp; Engine based, clean, powerful, customizable and sophisticated paginator for modern web app frameworks and ORMs.&lt;br /&gt;
&lt;br /&gt;
== '''Pages which needs to be optimized''' ==&lt;br /&gt;
&lt;br /&gt;
1) expertiza.ncsu.edu/grades/view?id=&amp;lt;ID of the team&amp;gt;&lt;br /&gt;
&lt;br /&gt;
2) expertiza.ncsu.edu/users/list&lt;br /&gt;
&lt;br /&gt;
== '''Project Design''' ==&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
For the purpose of this project, experts in the expertiza domain are Instructors. &lt;br /&gt;
&lt;br /&gt;
The following two patterns are implemented in the project - &lt;br /&gt;
&lt;br /&gt;
1.MVC Pattern - The project is implemented in Ruby on Rails that uses MVC architecture. It separates an application’s data model, user interface, and control logic into three distinct components (model, view, and controller, respectively). &lt;br /&gt;
&lt;br /&gt;
2.DRY Principle - We are trying to reuse the existing functionalities in Expertiza, thus avoiding code duplication. Whenever possible, code modification based on the existing classes, controllers, or tables will be done instead of creating the new one.&lt;br /&gt;
&lt;br /&gt;
3.Optimization - In order to optimize, we need to understand the factors which are causing the lag. This can be identified by using the flamegraph generation method and rack-mini-profiler statistics.&lt;br /&gt;
&lt;br /&gt;
=='''Approach'''==&lt;br /&gt;
To complete the given task, we identified the factors which are causing the lag. This was done by using flamegraph generation and rack-mini-profiler statistics. The statistics generated by rack miniprofiler helped us to understand the time taken by each component to get loaded. From these statistics, we identified the model/controller/view/database query which is causing this latency. From here, we identified the methods which needed to be implemented in order to optimize the webpage rendering.&lt;br /&gt;
&lt;br /&gt;
Optimization approach for the pages:&lt;br /&gt;
*users/list :- The approach to reduce loading time on this page was by implementing pagination. Instead of displaying all users and their data all at once, we display a certain number of users on one page, and rest of the users can be viewed by accessing the later pages. This reduces loading time of the page by reducing the amount of data to be fetched.&lt;br /&gt;
*grades/view : Ajax must be used for the optimization. Currently, all the data for all the teams present is loaded when the webpage is accessed. Instead, data for particular teams can be loaded when the user clicks on the expand button for that particular team. Thus, data for each team should be loaded asynchronously with ajax.&lt;br /&gt;
&lt;br /&gt;
=='''Identification of pages''' ==&lt;br /&gt;
===Analysis of the page expertiza.ncsu.edu/tree_display/list ===&lt;br /&gt;
&lt;br /&gt;
===FlameGraph Statistics===&lt;br /&gt;
The following is the flamegraph for this page:-&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:f.png]]&lt;br /&gt;
&lt;br /&gt;
The X axis of the FlameGraph represents the time taken to load the page. It can give a clear picture of where the expertiza page is getting bogged down. The widest layers take the longest to run. They’re the areas one should look into, because speeding them up could have the biggest impact. As we can see over here, most of the time taken over here is in the controller action.&lt;br /&gt;
&lt;br /&gt;
===MiniProfiler Statistics===&lt;br /&gt;
&lt;br /&gt;
The following is the rack-mini-profiler statistics for the page:-&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tre1.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
The box which is seen in the leftmost corner is the MiniProfiler statistics. MiniProfiler gives  a constant notification of how long each page takes to load. The miniprofiler statistics show the time taken to render the view as well as the corresponding SQL calls.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree2.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
This image shows the time and the number of SQL calls which are required for each rendering.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree5.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
Here as we can see the total number of SQL calls required for children_node_ng is 1123. This is causing the latency in the entire page by 10564.8 ms. These statistics helped us to identify the method which needs to be refactored.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree6.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
The total number of SQL calls required for 2 components here is 2 each. Hence we do not need to refactor this component.&lt;br /&gt;
&lt;br /&gt;
==  Solution ==&lt;br /&gt;
*users/list&lt;br /&gt;
The time taken to load the page was high because the server had to access through hundreds of rows in the database .The page was rendering the entire row of database at the same time. Pagination helped to split the database  into manageable chunks of data.&lt;br /&gt;
&lt;br /&gt;
*grades/view&lt;br /&gt;
The grades/view is the page where  the instructor accesses the grades statistics of each student.&lt;br /&gt;
The reason for  the slow down in the page is that the data for all the teams were loaded as soon as the page was loaded.The design of the page has an individual tab for each team, hence loading the entire data as soon as the page is loaded is quite redundant as the instructor needs to access the scores of each individual team at a given time.&lt;br /&gt;
The solution to this problem is to access the individual team statistics from the database when the instructor clicks the tab specified for the particular individual. &lt;br /&gt;
The existing code consists of a for loop in views/grades/_teams.html.erb, which renders the partial &amp;quot;views/grades/_tabbing.html.erb&amp;quot; which displays the data repeatedly. Instead, this partial could be rendered through AJAX or JQuery, whenever the expand button is clicked. This would save redundant loading of data and thus reduce the loading time of the page.&lt;br /&gt;
&lt;br /&gt;
Issues faced during implementation of this solution:- &lt;br /&gt;
&lt;br /&gt;
*While implementing this fix, we first created a controller method, which would render the required partial &amp;quot;views/grades/_tabbing.html.erb&amp;quot; when called. &lt;br /&gt;
*We passed the required data through the Rails params hash. However, since one argument that needed to be passed (tscore) is a Hash, when it enters the params hash, it is getting converted to a String. &lt;br /&gt;
*We tried passing the hash as it is, but after doing this all the data in the hash is not retained, i.e. there is a loss of data.&lt;br /&gt;
*We also tried converting the String back into Hash by using the eval method, and to_unsafe_h method.&lt;br /&gt;
*However, these methods require the hash to be present in a normal form i.e. key value pairs. &lt;br /&gt;
*But our hash has values as Objects, thus these methods cannot be applied&lt;br /&gt;
*Thus, we are unable to access the data in the String-hash. &lt;br /&gt;
*If this could be done, then our approach would result in successfully decreasing the loading time of the webpage.&lt;br /&gt;
&lt;br /&gt;
==Test Plan==&lt;br /&gt;
The project is based on optimizing the time required to load the pages which has been mentioned above,in order to test that there is an improvement in the time taken to load these pages one will have to compare the initial loading time and the time taken after the code has been modified.&lt;br /&gt;
&lt;br /&gt;
===Initial Setup for testing===&lt;br /&gt;
&lt;br /&gt;
1)Clone the git repository.&lt;br /&gt;
&lt;br /&gt;
2)Go to the commit on 3rd November(name: initial setup),this is the code which is originally provided by the professor and has not been modified. It however consists of the two gems required to check the loading time.&lt;br /&gt;
&lt;br /&gt;
3)To login as instructor :-&lt;br /&gt;
USERNAME :- instructor6&lt;br /&gt;
Password:- password&lt;br /&gt;
&lt;br /&gt;
===Testing===&lt;br /&gt;
&lt;br /&gt;
Check the time taken to load the page localhost:3000/tree_display/list on the left corner and compare the same for the latest pull. You will notice a substantial reduction in the loading time.&lt;br /&gt;
&lt;br /&gt;
===Automated Test===&lt;br /&gt;
&lt;br /&gt;
There can be no automated test for this program since the improvement in the performance is due to the inclusion of the pagination gem. &lt;br /&gt;
&lt;br /&gt;
Hence testing if the pagination gem will work is equivalent to checking if rails is working. &lt;br /&gt;
&lt;br /&gt;
As testing rails is not recommended  no automated test is added  for  changes made.&lt;/div&gt;</summary>
		<author><name>Krkulkar</name></author>
	</entry>
	<entry>
		<id>https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=113846</id>
		<title>CSC/ECE 517 Fall 2017/E17A8. Use a profiler to identify the problems / pages that take some time to load &amp; fix them</title>
		<link rel="alternate" type="text/html" href="https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=113846"/>
		<updated>2017-11-29T22:54:19Z</updated>

		<summary type="html">&lt;p&gt;Krkulkar: /* Approach */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;= Optimization for page loading in Expertiza =&lt;br /&gt;
&lt;br /&gt;
== '''Introduction''' ==&lt;br /&gt;
Expertiza is an online system that is used by students to view/submit assignments and review others' work. Expertiza also provides tools to visualize the scores and gauge the improvements made during the course semester. It also facilitates and monitors team projects. It is targeted at educational and non-profit organizations. The project is funded by the National Software Foundation (NSF), NCSU Learning in a Technology-Rich Environment (LITRE) program, the NCSU Faculty Center for Teaching and Learning, the NCSU STEM Initiative, and the Center for Advanced Computing and Communication.&lt;br /&gt;
&lt;br /&gt;
Expertiza is an open-source project with the source code available as a public repository on GitHub. It is developed using Ruby on Rails and is increasingly becoming robust thanks to the innumerable bugs being fixed by the community. The project has a micro-blog on SourceForge where the developer community report bugs and document updates.&lt;br /&gt;
&lt;br /&gt;
== '''Project Description''' ==&lt;br /&gt;
&lt;br /&gt;
1) Identifying the Expertiza pages which take time to load using Rack-mini-profiler and Flamegraphs.&lt;br /&gt;
&lt;br /&gt;
2) Propose fixes which would improve the Expertiza project.&lt;br /&gt;
&lt;br /&gt;
3) Optimizing the view, models and controllers for few of these corresponding fixes to improve the load time of these pages.&lt;br /&gt;
&lt;br /&gt;
== '''Gems Installed'''  ==&lt;br /&gt;
&lt;br /&gt;
*rack-mini-profiler :- Middleware that displays speed badge for every html page. Designed to work both in production and in development.&lt;br /&gt;
*flamegraphs :- Flame graphs are a visualization of profiled software, allowing the most frequent code-paths to be identified quickly and accurately.&lt;br /&gt;
*stackprof :- A sampling call-stack profiler for ruby 2.1+.Downloaded as a dependency for rack-mini-profiler.&lt;br /&gt;
*fast_stack :- fast_stack is dynamically resizable data structure optimized for fast iteration over the large arrays of similar elements avoiding memory fragmentation.&lt;br /&gt;
*Kaminari :- A Scope &amp;amp; Engine based, clean, powerful, customizable and sophisticated paginator for modern web app frameworks and ORMs.&lt;br /&gt;
&lt;br /&gt;
== '''Pages which needs to be optimized''' ==&lt;br /&gt;
&lt;br /&gt;
1) expertiza.ncsu.edu/grades/view?id=&amp;lt;ID of the team&amp;gt;&lt;br /&gt;
&lt;br /&gt;
2) expertiza.ncsu.edu/users/list&lt;br /&gt;
&lt;br /&gt;
== '''Project Design''' ==&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
For the purpose of this project, experts in the expertiza domain are Instructors. &lt;br /&gt;
&lt;br /&gt;
The following two patterns are implemented in the project - &lt;br /&gt;
&lt;br /&gt;
1.MVC Pattern - The project is implemented in Ruby on Rails that uses MVC architecture. It separates an application’s data model, user interface, and control logic into three distinct components (model, view, and controller, respectively). &lt;br /&gt;
&lt;br /&gt;
2.DRY Principle - We are trying to reuse the existing functionalities in Expertiza, thus avoiding code duplication. Whenever possible, code modification based on the existing classes, controllers, or tables will be done instead of creating the new one.&lt;br /&gt;
&lt;br /&gt;
3.Optimization - In order to optimize, we need to understand the factors which are causing the lag. This can be identified by using the flamegraph generation method and rack-mini-profiler statistics.&lt;br /&gt;
&lt;br /&gt;
=='''Approach'''==&lt;br /&gt;
To complete the given task, we identified the factors which are causing the lag. This was done by using flamegraph generation and rack-mini-profiler statistics. The statistics generated by rack miniprofiler helped us to understand the time taken by each component to get loaded. From these statistics, we identified the model/controller/view/database query which is causing this latency. From here, we identified the methods which needed to be implemented in order to optimize the webpage rendering.&lt;br /&gt;
&lt;br /&gt;
Optimization approach for the pages:&lt;br /&gt;
*users/list :- The approach to reduce loading time on this page was by implementing pagination. Instead of displaying all users and their data all at once, we display a certain number of users on one page, and rest of the users can be viewed by accessing the later pages. This reduces loading time of the page by reducing the amount of data to be fetched.&lt;br /&gt;
*grades/view : Ajax must be used for the optimization. Currently, all the data for all the teams present is loaded when the webpage is accessed. Instead, data for particular teams can be loaded when the user clicks on the expand button for that particular team. Thus, data for each team should be loaded asynchronously with ajax.&lt;br /&gt;
&lt;br /&gt;
==Identification of pages ==&lt;br /&gt;
===Analysis of page 1: expertiza.ncsu.edu/tree_display/list ===&lt;br /&gt;
&lt;br /&gt;
===FlameGraph Statistics===&lt;br /&gt;
The following is the flamegraph for this page:-&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:f.png]]&lt;br /&gt;
&lt;br /&gt;
The X axis of the FlameGraph represents the time taken to load the page. It can give a clear picture of where the expertiza page is getting bogged down. The widest layers take the longest to run. They’re the areas one should look into, because speeding them up could have the biggest impact. As we can see over here, most of the time taken over here is in the controller action.&lt;br /&gt;
&lt;br /&gt;
===MiniProfiler Statistics===&lt;br /&gt;
&lt;br /&gt;
The following is the rack-mini-profiler statistics for the page:-&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tre1.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
The box which is seen in the leftmost corner is the MiniProfiler statistics. MiniProfiler gives  a constant notification of how long each page takes to load. The miniprofiler statistics show the time taken to render the view as well as the corresponding SQL calls.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree2.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
This image shows the time and the number of SQL calls which are required for each rendering.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree5.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
Here as we can see the total number of SQL calls required for children_node_ng is 1123. This is causing the latency in the entire page by 10564.8 ms. These statistics helped us to identify the method which needs to be refactored.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree6.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
The total number of SQL calls required for 2 components here is 2 each. Hence we do not need to refactor this component.&lt;br /&gt;
&lt;br /&gt;
==  Solution ==&lt;br /&gt;
*users/list&lt;br /&gt;
The time taken to load the page was high because the server had to access through hundreds of rows in the database .The page was rendering the entire row of database at the same time. Pagination helped to split the database  into manageable chunks of data.&lt;br /&gt;
&lt;br /&gt;
*grades/view&lt;br /&gt;
The grades/view is the page where  the instructor accesses the grades statistics of each student.&lt;br /&gt;
The reason for  the slow down in the page is that the data for all the teams were loaded as soon as the page was loaded.The design of the page has an individual tab for each team, hence loading the entire data as soon as the page is loaded is quite redundant as the instructor needs to access the scores of each individual team at a given time.&lt;br /&gt;
The solution to this problem is to access the individual team statistics from the database when the instructor clicks the tab specified for the particular individual. &lt;br /&gt;
The existing code consists of a for loop in views/grades/_teams.html.erb, which renders the partial &amp;quot;views/grades/_tabbing.html.erb&amp;quot; which displays the data repeatedly. Instead, this partial could be rendered through AJAX or JQuery, whenever the expand button is clicked. This would save redundant loading of data and thus reduce the loading time of the page.&lt;br /&gt;
&lt;br /&gt;
Issues faced during implementation of this solution:- &lt;br /&gt;
&lt;br /&gt;
*While implementing this fix, we first created a controller method, which would render the required partial &amp;quot;views/grades/_tabbing.html.erb&amp;quot; when called. &lt;br /&gt;
*We passed the required data through the Rails params hash. However, since one argument that needed to be passed (tscore) is a Hash, when it enters the params hash, it is getting converted to a String. &lt;br /&gt;
*We tried passing the hash as it is, but after doing this all the data in the hash is not retained, i.e. there is a loss of data.&lt;br /&gt;
*We also tried converting the String back into Hash by using the eval method, and to_unsafe_h method.&lt;br /&gt;
*However, these methods require the hash to be present in a normal form i.e. key value pairs. &lt;br /&gt;
*But our hash has values as Objects, thus these methods cannot be applied&lt;br /&gt;
*Thus, we are unable to access the data in the String-hash. &lt;br /&gt;
*If this could be done, then our approach would result in successfully decreasing the loading time of the webpage.&lt;br /&gt;
&lt;br /&gt;
==Test Plan==&lt;br /&gt;
The project is based on optimizing the time required to load the pages which has been mentioned above,in order to test that there is an improvement in the time taken to load these pages one will have to compare the initial loading time and the time taken after the code has been modified.&lt;br /&gt;
&lt;br /&gt;
===Initial Setup for testing===&lt;br /&gt;
&lt;br /&gt;
1)Clone the git repository.&lt;br /&gt;
&lt;br /&gt;
2)Go to the commit on 3rd November(name: initial setup),this is the code which is originally provided by the professor and has not been modified. It however consists of the two gems required to check the loading time.&lt;br /&gt;
&lt;br /&gt;
3)To login as instructor :-&lt;br /&gt;
USERNAME :- instructor6&lt;br /&gt;
Password:- password&lt;br /&gt;
&lt;br /&gt;
===Testing===&lt;br /&gt;
&lt;br /&gt;
Check the time taken to load the page localhost:3000/tree_display/list on the left corner and compare the same for the latest pull. You will notice a substantial reduction in the loading time.&lt;br /&gt;
&lt;br /&gt;
===Automated Test===&lt;br /&gt;
&lt;br /&gt;
There can be no automated test for this program since the improvement in the performance is due to the inclusion of the pagination gem. &lt;br /&gt;
&lt;br /&gt;
Hence testing if the pagination gem will work is equivalent to checking if rails is working. &lt;br /&gt;
&lt;br /&gt;
As testing rails is not recommended  no automated test is added  for  changes made.&lt;/div&gt;</summary>
		<author><name>Krkulkar</name></author>
	</entry>
	<entry>
		<id>https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=113845</id>
		<title>CSC/ECE 517 Fall 2017/E17A8. Use a profiler to identify the problems / pages that take some time to load &amp; fix them</title>
		<link rel="alternate" type="text/html" href="https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=113845"/>
		<updated>2017-11-29T22:54:10Z</updated>

		<summary type="html">&lt;p&gt;Krkulkar: /* Project Design */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;= Optimization for page loading in Expertiza =&lt;br /&gt;
&lt;br /&gt;
== '''Introduction''' ==&lt;br /&gt;
Expertiza is an online system that is used by students to view/submit assignments and review others' work. Expertiza also provides tools to visualize the scores and gauge the improvements made during the course semester. It also facilitates and monitors team projects. It is targeted at educational and non-profit organizations. The project is funded by the National Software Foundation (NSF), NCSU Learning in a Technology-Rich Environment (LITRE) program, the NCSU Faculty Center for Teaching and Learning, the NCSU STEM Initiative, and the Center for Advanced Computing and Communication.&lt;br /&gt;
&lt;br /&gt;
Expertiza is an open-source project with the source code available as a public repository on GitHub. It is developed using Ruby on Rails and is increasingly becoming robust thanks to the innumerable bugs being fixed by the community. The project has a micro-blog on SourceForge where the developer community report bugs and document updates.&lt;br /&gt;
&lt;br /&gt;
== '''Project Description''' ==&lt;br /&gt;
&lt;br /&gt;
1) Identifying the Expertiza pages which take time to load using Rack-mini-profiler and Flamegraphs.&lt;br /&gt;
&lt;br /&gt;
2) Propose fixes which would improve the Expertiza project.&lt;br /&gt;
&lt;br /&gt;
3) Optimizing the view, models and controllers for few of these corresponding fixes to improve the load time of these pages.&lt;br /&gt;
&lt;br /&gt;
== '''Gems Installed'''  ==&lt;br /&gt;
&lt;br /&gt;
*rack-mini-profiler :- Middleware that displays speed badge for every html page. Designed to work both in production and in development.&lt;br /&gt;
*flamegraphs :- Flame graphs are a visualization of profiled software, allowing the most frequent code-paths to be identified quickly and accurately.&lt;br /&gt;
*stackprof :- A sampling call-stack profiler for ruby 2.1+.Downloaded as a dependency for rack-mini-profiler.&lt;br /&gt;
*fast_stack :- fast_stack is dynamically resizable data structure optimized for fast iteration over the large arrays of similar elements avoiding memory fragmentation.&lt;br /&gt;
*Kaminari :- A Scope &amp;amp; Engine based, clean, powerful, customizable and sophisticated paginator for modern web app frameworks and ORMs.&lt;br /&gt;
&lt;br /&gt;
== '''Pages which needs to be optimized''' ==&lt;br /&gt;
&lt;br /&gt;
1) expertiza.ncsu.edu/grades/view?id=&amp;lt;ID of the team&amp;gt;&lt;br /&gt;
&lt;br /&gt;
2) expertiza.ncsu.edu/users/list&lt;br /&gt;
&lt;br /&gt;
== '''Project Design''' ==&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
For the purpose of this project, experts in the expertiza domain are Instructors. &lt;br /&gt;
&lt;br /&gt;
The following two patterns are implemented in the project - &lt;br /&gt;
&lt;br /&gt;
1.MVC Pattern - The project is implemented in Ruby on Rails that uses MVC architecture. It separates an application’s data model, user interface, and control logic into three distinct components (model, view, and controller, respectively). &lt;br /&gt;
&lt;br /&gt;
2.DRY Principle - We are trying to reuse the existing functionalities in Expertiza, thus avoiding code duplication. Whenever possible, code modification based on the existing classes, controllers, or tables will be done instead of creating the new one.&lt;br /&gt;
&lt;br /&gt;
3.Optimization - In order to optimize, we need to understand the factors which are causing the lag. This can be identified by using the flamegraph generation method and rack-mini-profiler statistics.&lt;br /&gt;
&lt;br /&gt;
==Approach==&lt;br /&gt;
To complete the given task, we identified the factors which are causing the lag. This was done by using flamegraph generation and rack-mini-profiler statistics. The statistics generated by rack miniprofiler helped us to understand the time taken by each component to get loaded. From these statistics, we identified the model/controller/view/database query which is causing this latency. From here, we identified the methods which needed to be implemented in order to optimize the webpage rendering.&lt;br /&gt;
&lt;br /&gt;
Optimization approach for the pages:&lt;br /&gt;
*users/list :- The approach to reduce loading time on this page was by implementing pagination. Instead of displaying all users and their data all at once, we display a certain number of users on one page, and rest of the users can be viewed by accessing the later pages. This reduces loading time of the page by reducing the amount of data to be fetched.&lt;br /&gt;
*grades/view : Ajax must be used for the optimization. Currently, all the data for all the teams present is loaded when the webpage is accessed. Instead, data for particular teams can be loaded when the user clicks on the expand button for that particular team. Thus, data for each team should be loaded asynchronously with ajax.&lt;br /&gt;
&lt;br /&gt;
==Identification of pages ==&lt;br /&gt;
===Analysis of page 1: expertiza.ncsu.edu/tree_display/list ===&lt;br /&gt;
&lt;br /&gt;
===FlameGraph Statistics===&lt;br /&gt;
The following is the flamegraph for this page:-&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:f.png]]&lt;br /&gt;
&lt;br /&gt;
The X axis of the FlameGraph represents the time taken to load the page. It can give a clear picture of where the expertiza page is getting bogged down. The widest layers take the longest to run. They’re the areas one should look into, because speeding them up could have the biggest impact. As we can see over here, most of the time taken over here is in the controller action.&lt;br /&gt;
&lt;br /&gt;
===MiniProfiler Statistics===&lt;br /&gt;
&lt;br /&gt;
The following is the rack-mini-profiler statistics for the page:-&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tre1.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
The box which is seen in the leftmost corner is the MiniProfiler statistics. MiniProfiler gives  a constant notification of how long each page takes to load. The miniprofiler statistics show the time taken to render the view as well as the corresponding SQL calls.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree2.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
This image shows the time and the number of SQL calls which are required for each rendering.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree5.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
Here as we can see the total number of SQL calls required for children_node_ng is 1123. This is causing the latency in the entire page by 10564.8 ms. These statistics helped us to identify the method which needs to be refactored.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree6.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
The total number of SQL calls required for 2 components here is 2 each. Hence we do not need to refactor this component.&lt;br /&gt;
&lt;br /&gt;
==  Solution ==&lt;br /&gt;
*users/list&lt;br /&gt;
The time taken to load the page was high because the server had to access through hundreds of rows in the database .The page was rendering the entire row of database at the same time. Pagination helped to split the database  into manageable chunks of data.&lt;br /&gt;
&lt;br /&gt;
*grades/view&lt;br /&gt;
The grades/view is the page where  the instructor accesses the grades statistics of each student.&lt;br /&gt;
The reason for  the slow down in the page is that the data for all the teams were loaded as soon as the page was loaded.The design of the page has an individual tab for each team, hence loading the entire data as soon as the page is loaded is quite redundant as the instructor needs to access the scores of each individual team at a given time.&lt;br /&gt;
The solution to this problem is to access the individual team statistics from the database when the instructor clicks the tab specified for the particular individual. &lt;br /&gt;
The existing code consists of a for loop in views/grades/_teams.html.erb, which renders the partial &amp;quot;views/grades/_tabbing.html.erb&amp;quot; which displays the data repeatedly. Instead, this partial could be rendered through AJAX or JQuery, whenever the expand button is clicked. This would save redundant loading of data and thus reduce the loading time of the page.&lt;br /&gt;
&lt;br /&gt;
Issues faced during implementation of this solution:- &lt;br /&gt;
&lt;br /&gt;
*While implementing this fix, we first created a controller method, which would render the required partial &amp;quot;views/grades/_tabbing.html.erb&amp;quot; when called. &lt;br /&gt;
*We passed the required data through the Rails params hash. However, since one argument that needed to be passed (tscore) is a Hash, when it enters the params hash, it is getting converted to a String. &lt;br /&gt;
*We tried passing the hash as it is, but after doing this all the data in the hash is not retained, i.e. there is a loss of data.&lt;br /&gt;
*We also tried converting the String back into Hash by using the eval method, and to_unsafe_h method.&lt;br /&gt;
*However, these methods require the hash to be present in a normal form i.e. key value pairs. &lt;br /&gt;
*But our hash has values as Objects, thus these methods cannot be applied&lt;br /&gt;
*Thus, we are unable to access the data in the String-hash. &lt;br /&gt;
*If this could be done, then our approach would result in successfully decreasing the loading time of the webpage.&lt;br /&gt;
&lt;br /&gt;
==Test Plan==&lt;br /&gt;
The project is based on optimizing the time required to load the pages which has been mentioned above,in order to test that there is an improvement in the time taken to load these pages one will have to compare the initial loading time and the time taken after the code has been modified.&lt;br /&gt;
&lt;br /&gt;
===Initial Setup for testing===&lt;br /&gt;
&lt;br /&gt;
1)Clone the git repository.&lt;br /&gt;
&lt;br /&gt;
2)Go to the commit on 3rd November(name: initial setup),this is the code which is originally provided by the professor and has not been modified. It however consists of the two gems required to check the loading time.&lt;br /&gt;
&lt;br /&gt;
3)To login as instructor :-&lt;br /&gt;
USERNAME :- instructor6&lt;br /&gt;
Password:- password&lt;br /&gt;
&lt;br /&gt;
===Testing===&lt;br /&gt;
&lt;br /&gt;
Check the time taken to load the page localhost:3000/tree_display/list on the left corner and compare the same for the latest pull. You will notice a substantial reduction in the loading time.&lt;br /&gt;
&lt;br /&gt;
===Automated Test===&lt;br /&gt;
&lt;br /&gt;
There can be no automated test for this program since the improvement in the performance is due to the inclusion of the pagination gem. &lt;br /&gt;
&lt;br /&gt;
Hence testing if the pagination gem will work is equivalent to checking if rails is working. &lt;br /&gt;
&lt;br /&gt;
As testing rails is not recommended  no automated test is added  for  changes made.&lt;/div&gt;</summary>
		<author><name>Krkulkar</name></author>
	</entry>
	<entry>
		<id>https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=113844</id>
		<title>CSC/ECE 517 Fall 2017/E17A8. Use a profiler to identify the problems / pages that take some time to load &amp; fix them</title>
		<link rel="alternate" type="text/html" href="https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=113844"/>
		<updated>2017-11-29T22:53:58Z</updated>

		<summary type="html">&lt;p&gt;Krkulkar: /* Pages which needs to be optimized */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;= Optimization for page loading in Expertiza =&lt;br /&gt;
&lt;br /&gt;
== '''Introduction''' ==&lt;br /&gt;
Expertiza is an online system that is used by students to view/submit assignments and review others' work. Expertiza also provides tools to visualize the scores and gauge the improvements made during the course semester. It also facilitates and monitors team projects. It is targeted at educational and non-profit organizations. The project is funded by the National Software Foundation (NSF), NCSU Learning in a Technology-Rich Environment (LITRE) program, the NCSU Faculty Center for Teaching and Learning, the NCSU STEM Initiative, and the Center for Advanced Computing and Communication.&lt;br /&gt;
&lt;br /&gt;
Expertiza is an open-source project with the source code available as a public repository on GitHub. It is developed using Ruby on Rails and is increasingly becoming robust thanks to the innumerable bugs being fixed by the community. The project has a micro-blog on SourceForge where the developer community report bugs and document updates.&lt;br /&gt;
&lt;br /&gt;
== '''Project Description''' ==&lt;br /&gt;
&lt;br /&gt;
1) Identifying the Expertiza pages which take time to load using Rack-mini-profiler and Flamegraphs.&lt;br /&gt;
&lt;br /&gt;
2) Propose fixes which would improve the Expertiza project.&lt;br /&gt;
&lt;br /&gt;
3) Optimizing the view, models and controllers for few of these corresponding fixes to improve the load time of these pages.&lt;br /&gt;
&lt;br /&gt;
== '''Gems Installed'''  ==&lt;br /&gt;
&lt;br /&gt;
*rack-mini-profiler :- Middleware that displays speed badge for every html page. Designed to work both in production and in development.&lt;br /&gt;
*flamegraphs :- Flame graphs are a visualization of profiled software, allowing the most frequent code-paths to be identified quickly and accurately.&lt;br /&gt;
*stackprof :- A sampling call-stack profiler for ruby 2.1+.Downloaded as a dependency for rack-mini-profiler.&lt;br /&gt;
*fast_stack :- fast_stack is dynamically resizable data structure optimized for fast iteration over the large arrays of similar elements avoiding memory fragmentation.&lt;br /&gt;
*Kaminari :- A Scope &amp;amp; Engine based, clean, powerful, customizable and sophisticated paginator for modern web app frameworks and ORMs.&lt;br /&gt;
&lt;br /&gt;
== '''Pages which needs to be optimized''' ==&lt;br /&gt;
&lt;br /&gt;
1) expertiza.ncsu.edu/grades/view?id=&amp;lt;ID of the team&amp;gt;&lt;br /&gt;
&lt;br /&gt;
2) expertiza.ncsu.edu/users/list&lt;br /&gt;
&lt;br /&gt;
== Project Design ==&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
For the purpose of this project, experts in the expertiza domain are Instructors. &lt;br /&gt;
&lt;br /&gt;
The following two patterns are implemented in the project - &lt;br /&gt;
&lt;br /&gt;
1.MVC Pattern - The project is implemented in Ruby on Rails that uses MVC architecture. It separates an application’s data model, user interface, and control logic into three distinct components (model, view, and controller, respectively). &lt;br /&gt;
&lt;br /&gt;
2.DRY Principle - We are trying to reuse the existing functionalities in Expertiza, thus avoiding code duplication. Whenever possible, code modification based on the existing classes, controllers, or tables will be done instead of creating the new one.&lt;br /&gt;
&lt;br /&gt;
3.Optimization - In order to optimize, we need to understand the factors which are causing the lag. This can be identified by using the flamegraph generation method and rack-mini-profiler statistics.&lt;br /&gt;
&lt;br /&gt;
==Approach==&lt;br /&gt;
To complete the given task, we identified the factors which are causing the lag. This was done by using flamegraph generation and rack-mini-profiler statistics. The statistics generated by rack miniprofiler helped us to understand the time taken by each component to get loaded. From these statistics, we identified the model/controller/view/database query which is causing this latency. From here, we identified the methods which needed to be implemented in order to optimize the webpage rendering.&lt;br /&gt;
&lt;br /&gt;
Optimization approach for the pages:&lt;br /&gt;
*users/list :- The approach to reduce loading time on this page was by implementing pagination. Instead of displaying all users and their data all at once, we display a certain number of users on one page, and rest of the users can be viewed by accessing the later pages. This reduces loading time of the page by reducing the amount of data to be fetched.&lt;br /&gt;
*grades/view : Ajax must be used for the optimization. Currently, all the data for all the teams present is loaded when the webpage is accessed. Instead, data for particular teams can be loaded when the user clicks on the expand button for that particular team. Thus, data for each team should be loaded asynchronously with ajax.&lt;br /&gt;
&lt;br /&gt;
==Identification of pages ==&lt;br /&gt;
===Analysis of page 1: expertiza.ncsu.edu/tree_display/list ===&lt;br /&gt;
&lt;br /&gt;
===FlameGraph Statistics===&lt;br /&gt;
The following is the flamegraph for this page:-&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:f.png]]&lt;br /&gt;
&lt;br /&gt;
The X axis of the FlameGraph represents the time taken to load the page. It can give a clear picture of where the expertiza page is getting bogged down. The widest layers take the longest to run. They’re the areas one should look into, because speeding them up could have the biggest impact. As we can see over here, most of the time taken over here is in the controller action.&lt;br /&gt;
&lt;br /&gt;
===MiniProfiler Statistics===&lt;br /&gt;
&lt;br /&gt;
The following is the rack-mini-profiler statistics for the page:-&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tre1.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
The box which is seen in the leftmost corner is the MiniProfiler statistics. MiniProfiler gives  a constant notification of how long each page takes to load. The miniprofiler statistics show the time taken to render the view as well as the corresponding SQL calls.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree2.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
This image shows the time and the number of SQL calls which are required for each rendering.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree5.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
Here as we can see the total number of SQL calls required for children_node_ng is 1123. This is causing the latency in the entire page by 10564.8 ms. These statistics helped us to identify the method which needs to be refactored.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree6.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
The total number of SQL calls required for 2 components here is 2 each. Hence we do not need to refactor this component.&lt;br /&gt;
&lt;br /&gt;
==  Solution ==&lt;br /&gt;
*users/list&lt;br /&gt;
The time taken to load the page was high because the server had to access through hundreds of rows in the database .The page was rendering the entire row of database at the same time. Pagination helped to split the database  into manageable chunks of data.&lt;br /&gt;
&lt;br /&gt;
*grades/view&lt;br /&gt;
The grades/view is the page where  the instructor accesses the grades statistics of each student.&lt;br /&gt;
The reason for  the slow down in the page is that the data for all the teams were loaded as soon as the page was loaded.The design of the page has an individual tab for each team, hence loading the entire data as soon as the page is loaded is quite redundant as the instructor needs to access the scores of each individual team at a given time.&lt;br /&gt;
The solution to this problem is to access the individual team statistics from the database when the instructor clicks the tab specified for the particular individual. &lt;br /&gt;
The existing code consists of a for loop in views/grades/_teams.html.erb, which renders the partial &amp;quot;views/grades/_tabbing.html.erb&amp;quot; which displays the data repeatedly. Instead, this partial could be rendered through AJAX or JQuery, whenever the expand button is clicked. This would save redundant loading of data and thus reduce the loading time of the page.&lt;br /&gt;
&lt;br /&gt;
Issues faced during implementation of this solution:- &lt;br /&gt;
&lt;br /&gt;
*While implementing this fix, we first created a controller method, which would render the required partial &amp;quot;views/grades/_tabbing.html.erb&amp;quot; when called. &lt;br /&gt;
*We passed the required data through the Rails params hash. However, since one argument that needed to be passed (tscore) is a Hash, when it enters the params hash, it is getting converted to a String. &lt;br /&gt;
*We tried passing the hash as it is, but after doing this all the data in the hash is not retained, i.e. there is a loss of data.&lt;br /&gt;
*We also tried converting the String back into Hash by using the eval method, and to_unsafe_h method.&lt;br /&gt;
*However, these methods require the hash to be present in a normal form i.e. key value pairs. &lt;br /&gt;
*But our hash has values as Objects, thus these methods cannot be applied&lt;br /&gt;
*Thus, we are unable to access the data in the String-hash. &lt;br /&gt;
*If this could be done, then our approach would result in successfully decreasing the loading time of the webpage.&lt;br /&gt;
&lt;br /&gt;
==Test Plan==&lt;br /&gt;
The project is based on optimizing the time required to load the pages which has been mentioned above,in order to test that there is an improvement in the time taken to load these pages one will have to compare the initial loading time and the time taken after the code has been modified.&lt;br /&gt;
&lt;br /&gt;
===Initial Setup for testing===&lt;br /&gt;
&lt;br /&gt;
1)Clone the git repository.&lt;br /&gt;
&lt;br /&gt;
2)Go to the commit on 3rd November(name: initial setup),this is the code which is originally provided by the professor and has not been modified. It however consists of the two gems required to check the loading time.&lt;br /&gt;
&lt;br /&gt;
3)To login as instructor :-&lt;br /&gt;
USERNAME :- instructor6&lt;br /&gt;
Password:- password&lt;br /&gt;
&lt;br /&gt;
===Testing===&lt;br /&gt;
&lt;br /&gt;
Check the time taken to load the page localhost:3000/tree_display/list on the left corner and compare the same for the latest pull. You will notice a substantial reduction in the loading time.&lt;br /&gt;
&lt;br /&gt;
===Automated Test===&lt;br /&gt;
&lt;br /&gt;
There can be no automated test for this program since the improvement in the performance is due to the inclusion of the pagination gem. &lt;br /&gt;
&lt;br /&gt;
Hence testing if the pagination gem will work is equivalent to checking if rails is working. &lt;br /&gt;
&lt;br /&gt;
As testing rails is not recommended  no automated test is added  for  changes made.&lt;/div&gt;</summary>
		<author><name>Krkulkar</name></author>
	</entry>
	<entry>
		<id>https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=113843</id>
		<title>CSC/ECE 517 Fall 2017/E17A8. Use a profiler to identify the problems / pages that take some time to load &amp; fix them</title>
		<link rel="alternate" type="text/html" href="https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=113843"/>
		<updated>2017-11-29T22:53:47Z</updated>

		<summary type="html">&lt;p&gt;Krkulkar: /* Gems Installed */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;= Optimization for page loading in Expertiza =&lt;br /&gt;
&lt;br /&gt;
== '''Introduction''' ==&lt;br /&gt;
Expertiza is an online system that is used by students to view/submit assignments and review others' work. Expertiza also provides tools to visualize the scores and gauge the improvements made during the course semester. It also facilitates and monitors team projects. It is targeted at educational and non-profit organizations. The project is funded by the National Software Foundation (NSF), NCSU Learning in a Technology-Rich Environment (LITRE) program, the NCSU Faculty Center for Teaching and Learning, the NCSU STEM Initiative, and the Center for Advanced Computing and Communication.&lt;br /&gt;
&lt;br /&gt;
Expertiza is an open-source project with the source code available as a public repository on GitHub. It is developed using Ruby on Rails and is increasingly becoming robust thanks to the innumerable bugs being fixed by the community. The project has a micro-blog on SourceForge where the developer community report bugs and document updates.&lt;br /&gt;
&lt;br /&gt;
== '''Project Description''' ==&lt;br /&gt;
&lt;br /&gt;
1) Identifying the Expertiza pages which take time to load using Rack-mini-profiler and Flamegraphs.&lt;br /&gt;
&lt;br /&gt;
2) Propose fixes which would improve the Expertiza project.&lt;br /&gt;
&lt;br /&gt;
3) Optimizing the view, models and controllers for few of these corresponding fixes to improve the load time of these pages.&lt;br /&gt;
&lt;br /&gt;
== '''Gems Installed'''  ==&lt;br /&gt;
&lt;br /&gt;
*rack-mini-profiler :- Middleware that displays speed badge for every html page. Designed to work both in production and in development.&lt;br /&gt;
*flamegraphs :- Flame graphs are a visualization of profiled software, allowing the most frequent code-paths to be identified quickly and accurately.&lt;br /&gt;
*stackprof :- A sampling call-stack profiler for ruby 2.1+.Downloaded as a dependency for rack-mini-profiler.&lt;br /&gt;
*fast_stack :- fast_stack is dynamically resizable data structure optimized for fast iteration over the large arrays of similar elements avoiding memory fragmentation.&lt;br /&gt;
*Kaminari :- A Scope &amp;amp; Engine based, clean, powerful, customizable and sophisticated paginator for modern web app frameworks and ORMs.&lt;br /&gt;
&lt;br /&gt;
== Pages which needs to be optimized ==&lt;br /&gt;
&lt;br /&gt;
1) expertiza.ncsu.edu/grades/view?id=&amp;lt;ID of the team&amp;gt;&lt;br /&gt;
&lt;br /&gt;
2) expertiza.ncsu.edu/users/list&lt;br /&gt;
&lt;br /&gt;
== Project Design ==&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
For the purpose of this project, experts in the expertiza domain are Instructors. &lt;br /&gt;
&lt;br /&gt;
The following two patterns are implemented in the project - &lt;br /&gt;
&lt;br /&gt;
1.MVC Pattern - The project is implemented in Ruby on Rails that uses MVC architecture. It separates an application’s data model, user interface, and control logic into three distinct components (model, view, and controller, respectively). &lt;br /&gt;
&lt;br /&gt;
2.DRY Principle - We are trying to reuse the existing functionalities in Expertiza, thus avoiding code duplication. Whenever possible, code modification based on the existing classes, controllers, or tables will be done instead of creating the new one.&lt;br /&gt;
&lt;br /&gt;
3.Optimization - In order to optimize, we need to understand the factors which are causing the lag. This can be identified by using the flamegraph generation method and rack-mini-profiler statistics.&lt;br /&gt;
&lt;br /&gt;
==Approach==&lt;br /&gt;
To complete the given task, we identified the factors which are causing the lag. This was done by using flamegraph generation and rack-mini-profiler statistics. The statistics generated by rack miniprofiler helped us to understand the time taken by each component to get loaded. From these statistics, we identified the model/controller/view/database query which is causing this latency. From here, we identified the methods which needed to be implemented in order to optimize the webpage rendering.&lt;br /&gt;
&lt;br /&gt;
Optimization approach for the pages:&lt;br /&gt;
*users/list :- The approach to reduce loading time on this page was by implementing pagination. Instead of displaying all users and their data all at once, we display a certain number of users on one page, and rest of the users can be viewed by accessing the later pages. This reduces loading time of the page by reducing the amount of data to be fetched.&lt;br /&gt;
*grades/view : Ajax must be used for the optimization. Currently, all the data for all the teams present is loaded when the webpage is accessed. Instead, data for particular teams can be loaded when the user clicks on the expand button for that particular team. Thus, data for each team should be loaded asynchronously with ajax.&lt;br /&gt;
&lt;br /&gt;
==Identification of pages ==&lt;br /&gt;
===Analysis of page 1: expertiza.ncsu.edu/tree_display/list ===&lt;br /&gt;
&lt;br /&gt;
===FlameGraph Statistics===&lt;br /&gt;
The following is the flamegraph for this page:-&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:f.png]]&lt;br /&gt;
&lt;br /&gt;
The X axis of the FlameGraph represents the time taken to load the page. It can give a clear picture of where the expertiza page is getting bogged down. The widest layers take the longest to run. They’re the areas one should look into, because speeding them up could have the biggest impact. As we can see over here, most of the time taken over here is in the controller action.&lt;br /&gt;
&lt;br /&gt;
===MiniProfiler Statistics===&lt;br /&gt;
&lt;br /&gt;
The following is the rack-mini-profiler statistics for the page:-&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tre1.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
The box which is seen in the leftmost corner is the MiniProfiler statistics. MiniProfiler gives  a constant notification of how long each page takes to load. The miniprofiler statistics show the time taken to render the view as well as the corresponding SQL calls.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree2.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
This image shows the time and the number of SQL calls which are required for each rendering.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree5.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
Here as we can see the total number of SQL calls required for children_node_ng is 1123. This is causing the latency in the entire page by 10564.8 ms. These statistics helped us to identify the method which needs to be refactored.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree6.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
The total number of SQL calls required for 2 components here is 2 each. Hence we do not need to refactor this component.&lt;br /&gt;
&lt;br /&gt;
==  Solution ==&lt;br /&gt;
*users/list&lt;br /&gt;
The time taken to load the page was high because the server had to access through hundreds of rows in the database .The page was rendering the entire row of database at the same time. Pagination helped to split the database  into manageable chunks of data.&lt;br /&gt;
&lt;br /&gt;
*grades/view&lt;br /&gt;
The grades/view is the page where  the instructor accesses the grades statistics of each student.&lt;br /&gt;
The reason for  the slow down in the page is that the data for all the teams were loaded as soon as the page was loaded.The design of the page has an individual tab for each team, hence loading the entire data as soon as the page is loaded is quite redundant as the instructor needs to access the scores of each individual team at a given time.&lt;br /&gt;
The solution to this problem is to access the individual team statistics from the database when the instructor clicks the tab specified for the particular individual. &lt;br /&gt;
The existing code consists of a for loop in views/grades/_teams.html.erb, which renders the partial &amp;quot;views/grades/_tabbing.html.erb&amp;quot; which displays the data repeatedly. Instead, this partial could be rendered through AJAX or JQuery, whenever the expand button is clicked. This would save redundant loading of data and thus reduce the loading time of the page.&lt;br /&gt;
&lt;br /&gt;
Issues faced during implementation of this solution:- &lt;br /&gt;
&lt;br /&gt;
*While implementing this fix, we first created a controller method, which would render the required partial &amp;quot;views/grades/_tabbing.html.erb&amp;quot; when called. &lt;br /&gt;
*We passed the required data through the Rails params hash. However, since one argument that needed to be passed (tscore) is a Hash, when it enters the params hash, it is getting converted to a String. &lt;br /&gt;
*We tried passing the hash as it is, but after doing this all the data in the hash is not retained, i.e. there is a loss of data.&lt;br /&gt;
*We also tried converting the String back into Hash by using the eval method, and to_unsafe_h method.&lt;br /&gt;
*However, these methods require the hash to be present in a normal form i.e. key value pairs. &lt;br /&gt;
*But our hash has values as Objects, thus these methods cannot be applied&lt;br /&gt;
*Thus, we are unable to access the data in the String-hash. &lt;br /&gt;
*If this could be done, then our approach would result in successfully decreasing the loading time of the webpage.&lt;br /&gt;
&lt;br /&gt;
==Test Plan==&lt;br /&gt;
The project is based on optimizing the time required to load the pages which has been mentioned above,in order to test that there is an improvement in the time taken to load these pages one will have to compare the initial loading time and the time taken after the code has been modified.&lt;br /&gt;
&lt;br /&gt;
===Initial Setup for testing===&lt;br /&gt;
&lt;br /&gt;
1)Clone the git repository.&lt;br /&gt;
&lt;br /&gt;
2)Go to the commit on 3rd November(name: initial setup),this is the code which is originally provided by the professor and has not been modified. It however consists of the two gems required to check the loading time.&lt;br /&gt;
&lt;br /&gt;
3)To login as instructor :-&lt;br /&gt;
USERNAME :- instructor6&lt;br /&gt;
Password:- password&lt;br /&gt;
&lt;br /&gt;
===Testing===&lt;br /&gt;
&lt;br /&gt;
Check the time taken to load the page localhost:3000/tree_display/list on the left corner and compare the same for the latest pull. You will notice a substantial reduction in the loading time.&lt;br /&gt;
&lt;br /&gt;
===Automated Test===&lt;br /&gt;
&lt;br /&gt;
There can be no automated test for this program since the improvement in the performance is due to the inclusion of the pagination gem. &lt;br /&gt;
&lt;br /&gt;
Hence testing if the pagination gem will work is equivalent to checking if rails is working. &lt;br /&gt;
&lt;br /&gt;
As testing rails is not recommended  no automated test is added  for  changes made.&lt;/div&gt;</summary>
		<author><name>Krkulkar</name></author>
	</entry>
	<entry>
		<id>https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=113842</id>
		<title>CSC/ECE 517 Fall 2017/E17A8. Use a profiler to identify the problems / pages that take some time to load &amp; fix them</title>
		<link rel="alternate" type="text/html" href="https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=113842"/>
		<updated>2017-11-29T22:53:38Z</updated>

		<summary type="html">&lt;p&gt;Krkulkar: /* Project Description */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;= Optimization for page loading in Expertiza =&lt;br /&gt;
&lt;br /&gt;
== '''Introduction''' ==&lt;br /&gt;
Expertiza is an online system that is used by students to view/submit assignments and review others' work. Expertiza also provides tools to visualize the scores and gauge the improvements made during the course semester. It also facilitates and monitors team projects. It is targeted at educational and non-profit organizations. The project is funded by the National Software Foundation (NSF), NCSU Learning in a Technology-Rich Environment (LITRE) program, the NCSU Faculty Center for Teaching and Learning, the NCSU STEM Initiative, and the Center for Advanced Computing and Communication.&lt;br /&gt;
&lt;br /&gt;
Expertiza is an open-source project with the source code available as a public repository on GitHub. It is developed using Ruby on Rails and is increasingly becoming robust thanks to the innumerable bugs being fixed by the community. The project has a micro-blog on SourceForge where the developer community report bugs and document updates.&lt;br /&gt;
&lt;br /&gt;
== '''Project Description''' ==&lt;br /&gt;
&lt;br /&gt;
1) Identifying the Expertiza pages which take time to load using Rack-mini-profiler and Flamegraphs.&lt;br /&gt;
&lt;br /&gt;
2) Propose fixes which would improve the Expertiza project.&lt;br /&gt;
&lt;br /&gt;
3) Optimizing the view, models and controllers for few of these corresponding fixes to improve the load time of these pages.&lt;br /&gt;
&lt;br /&gt;
== Gems Installed  ==&lt;br /&gt;
&lt;br /&gt;
*rack-mini-profiler :- Middleware that displays speed badge for every html page. Designed to work both in production and in development.&lt;br /&gt;
*flamegraphs :- Flame graphs are a visualization of profiled software, allowing the most frequent code-paths to be identified quickly and accurately.&lt;br /&gt;
*stackprof :- A sampling call-stack profiler for ruby 2.1+.Downloaded as a dependency for rack-mini-profiler.&lt;br /&gt;
*fast_stack :- fast_stack is dynamically resizable data structure optimized for fast iteration over the large arrays of similar elements avoiding memory fragmentation.&lt;br /&gt;
*Kaminari :- A Scope &amp;amp; Engine based, clean, powerful, customizable and sophisticated paginator for modern web app frameworks and ORMs.&lt;br /&gt;
&lt;br /&gt;
== Pages which needs to be optimized ==&lt;br /&gt;
&lt;br /&gt;
1) expertiza.ncsu.edu/grades/view?id=&amp;lt;ID of the team&amp;gt;&lt;br /&gt;
&lt;br /&gt;
2) expertiza.ncsu.edu/users/list&lt;br /&gt;
&lt;br /&gt;
== Project Design ==&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
For the purpose of this project, experts in the expertiza domain are Instructors. &lt;br /&gt;
&lt;br /&gt;
The following two patterns are implemented in the project - &lt;br /&gt;
&lt;br /&gt;
1.MVC Pattern - The project is implemented in Ruby on Rails that uses MVC architecture. It separates an application’s data model, user interface, and control logic into three distinct components (model, view, and controller, respectively). &lt;br /&gt;
&lt;br /&gt;
2.DRY Principle - We are trying to reuse the existing functionalities in Expertiza, thus avoiding code duplication. Whenever possible, code modification based on the existing classes, controllers, or tables will be done instead of creating the new one.&lt;br /&gt;
&lt;br /&gt;
3.Optimization - In order to optimize, we need to understand the factors which are causing the lag. This can be identified by using the flamegraph generation method and rack-mini-profiler statistics.&lt;br /&gt;
&lt;br /&gt;
==Approach==&lt;br /&gt;
To complete the given task, we identified the factors which are causing the lag. This was done by using flamegraph generation and rack-mini-profiler statistics. The statistics generated by rack miniprofiler helped us to understand the time taken by each component to get loaded. From these statistics, we identified the model/controller/view/database query which is causing this latency. From here, we identified the methods which needed to be implemented in order to optimize the webpage rendering.&lt;br /&gt;
&lt;br /&gt;
Optimization approach for the pages:&lt;br /&gt;
*users/list :- The approach to reduce loading time on this page was by implementing pagination. Instead of displaying all users and their data all at once, we display a certain number of users on one page, and rest of the users can be viewed by accessing the later pages. This reduces loading time of the page by reducing the amount of data to be fetched.&lt;br /&gt;
*grades/view : Ajax must be used for the optimization. Currently, all the data for all the teams present is loaded when the webpage is accessed. Instead, data for particular teams can be loaded when the user clicks on the expand button for that particular team. Thus, data for each team should be loaded asynchronously with ajax.&lt;br /&gt;
&lt;br /&gt;
==Identification of pages ==&lt;br /&gt;
===Analysis of page 1: expertiza.ncsu.edu/tree_display/list ===&lt;br /&gt;
&lt;br /&gt;
===FlameGraph Statistics===&lt;br /&gt;
The following is the flamegraph for this page:-&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:f.png]]&lt;br /&gt;
&lt;br /&gt;
The X axis of the FlameGraph represents the time taken to load the page. It can give a clear picture of where the expertiza page is getting bogged down. The widest layers take the longest to run. They’re the areas one should look into, because speeding them up could have the biggest impact. As we can see over here, most of the time taken over here is in the controller action.&lt;br /&gt;
&lt;br /&gt;
===MiniProfiler Statistics===&lt;br /&gt;
&lt;br /&gt;
The following is the rack-mini-profiler statistics for the page:-&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tre1.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
The box which is seen in the leftmost corner is the MiniProfiler statistics. MiniProfiler gives  a constant notification of how long each page takes to load. The miniprofiler statistics show the time taken to render the view as well as the corresponding SQL calls.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree2.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
This image shows the time and the number of SQL calls which are required for each rendering.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree5.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
Here as we can see the total number of SQL calls required for children_node_ng is 1123. This is causing the latency in the entire page by 10564.8 ms. These statistics helped us to identify the method which needs to be refactored.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree6.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
The total number of SQL calls required for 2 components here is 2 each. Hence we do not need to refactor this component.&lt;br /&gt;
&lt;br /&gt;
==  Solution ==&lt;br /&gt;
*users/list&lt;br /&gt;
The time taken to load the page was high because the server had to access through hundreds of rows in the database .The page was rendering the entire row of database at the same time. Pagination helped to split the database  into manageable chunks of data.&lt;br /&gt;
&lt;br /&gt;
*grades/view&lt;br /&gt;
The grades/view is the page where  the instructor accesses the grades statistics of each student.&lt;br /&gt;
The reason for  the slow down in the page is that the data for all the teams were loaded as soon as the page was loaded.The design of the page has an individual tab for each team, hence loading the entire data as soon as the page is loaded is quite redundant as the instructor needs to access the scores of each individual team at a given time.&lt;br /&gt;
The solution to this problem is to access the individual team statistics from the database when the instructor clicks the tab specified for the particular individual. &lt;br /&gt;
The existing code consists of a for loop in views/grades/_teams.html.erb, which renders the partial &amp;quot;views/grades/_tabbing.html.erb&amp;quot; which displays the data repeatedly. Instead, this partial could be rendered through AJAX or JQuery, whenever the expand button is clicked. This would save redundant loading of data and thus reduce the loading time of the page.&lt;br /&gt;
&lt;br /&gt;
Issues faced during implementation of this solution:- &lt;br /&gt;
&lt;br /&gt;
*While implementing this fix, we first created a controller method, which would render the required partial &amp;quot;views/grades/_tabbing.html.erb&amp;quot; when called. &lt;br /&gt;
*We passed the required data through the Rails params hash. However, since one argument that needed to be passed (tscore) is a Hash, when it enters the params hash, it is getting converted to a String. &lt;br /&gt;
*We tried passing the hash as it is, but after doing this all the data in the hash is not retained, i.e. there is a loss of data.&lt;br /&gt;
*We also tried converting the String back into Hash by using the eval method, and to_unsafe_h method.&lt;br /&gt;
*However, these methods require the hash to be present in a normal form i.e. key value pairs. &lt;br /&gt;
*But our hash has values as Objects, thus these methods cannot be applied&lt;br /&gt;
*Thus, we are unable to access the data in the String-hash. &lt;br /&gt;
*If this could be done, then our approach would result in successfully decreasing the loading time of the webpage.&lt;br /&gt;
&lt;br /&gt;
==Test Plan==&lt;br /&gt;
The project is based on optimizing the time required to load the pages which has been mentioned above,in order to test that there is an improvement in the time taken to load these pages one will have to compare the initial loading time and the time taken after the code has been modified.&lt;br /&gt;
&lt;br /&gt;
===Initial Setup for testing===&lt;br /&gt;
&lt;br /&gt;
1)Clone the git repository.&lt;br /&gt;
&lt;br /&gt;
2)Go to the commit on 3rd November(name: initial setup),this is the code which is originally provided by the professor and has not been modified. It however consists of the two gems required to check the loading time.&lt;br /&gt;
&lt;br /&gt;
3)To login as instructor :-&lt;br /&gt;
USERNAME :- instructor6&lt;br /&gt;
Password:- password&lt;br /&gt;
&lt;br /&gt;
===Testing===&lt;br /&gt;
&lt;br /&gt;
Check the time taken to load the page localhost:3000/tree_display/list on the left corner and compare the same for the latest pull. You will notice a substantial reduction in the loading time.&lt;br /&gt;
&lt;br /&gt;
===Automated Test===&lt;br /&gt;
&lt;br /&gt;
There can be no automated test for this program since the improvement in the performance is due to the inclusion of the pagination gem. &lt;br /&gt;
&lt;br /&gt;
Hence testing if the pagination gem will work is equivalent to checking if rails is working. &lt;br /&gt;
&lt;br /&gt;
As testing rails is not recommended  no automated test is added  for  changes made.&lt;/div&gt;</summary>
		<author><name>Krkulkar</name></author>
	</entry>
	<entry>
		<id>https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=113841</id>
		<title>CSC/ECE 517 Fall 2017/E17A8. Use a profiler to identify the problems / pages that take some time to load &amp; fix them</title>
		<link rel="alternate" type="text/html" href="https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=113841"/>
		<updated>2017-11-29T22:53:27Z</updated>

		<summary type="html">&lt;p&gt;Krkulkar: /* Introduction */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;= Optimization for page loading in Expertiza =&lt;br /&gt;
&lt;br /&gt;
== '''Introduction''' ==&lt;br /&gt;
Expertiza is an online system that is used by students to view/submit assignments and review others' work. Expertiza also provides tools to visualize the scores and gauge the improvements made during the course semester. It also facilitates and monitors team projects. It is targeted at educational and non-profit organizations. The project is funded by the National Software Foundation (NSF), NCSU Learning in a Technology-Rich Environment (LITRE) program, the NCSU Faculty Center for Teaching and Learning, the NCSU STEM Initiative, and the Center for Advanced Computing and Communication.&lt;br /&gt;
&lt;br /&gt;
Expertiza is an open-source project with the source code available as a public repository on GitHub. It is developed using Ruby on Rails and is increasingly becoming robust thanks to the innumerable bugs being fixed by the community. The project has a micro-blog on SourceForge where the developer community report bugs and document updates.&lt;br /&gt;
&lt;br /&gt;
== Project Description ==&lt;br /&gt;
&lt;br /&gt;
1) Identifying the Expertiza pages which take time to load using Rack-mini-profiler and Flamegraphs.&lt;br /&gt;
&lt;br /&gt;
2) Propose fixes which would improve the Expertiza project.&lt;br /&gt;
&lt;br /&gt;
3) Optimizing the view, models and controllers for few of these corresponding fixes to improve the load time of these pages.&lt;br /&gt;
&lt;br /&gt;
== Gems Installed  ==&lt;br /&gt;
&lt;br /&gt;
*rack-mini-profiler :- Middleware that displays speed badge for every html page. Designed to work both in production and in development.&lt;br /&gt;
*flamegraphs :- Flame graphs are a visualization of profiled software, allowing the most frequent code-paths to be identified quickly and accurately.&lt;br /&gt;
*stackprof :- A sampling call-stack profiler for ruby 2.1+.Downloaded as a dependency for rack-mini-profiler.&lt;br /&gt;
*fast_stack :- fast_stack is dynamically resizable data structure optimized for fast iteration over the large arrays of similar elements avoiding memory fragmentation.&lt;br /&gt;
*Kaminari :- A Scope &amp;amp; Engine based, clean, powerful, customizable and sophisticated paginator for modern web app frameworks and ORMs.&lt;br /&gt;
&lt;br /&gt;
== Pages which needs to be optimized ==&lt;br /&gt;
&lt;br /&gt;
1) expertiza.ncsu.edu/grades/view?id=&amp;lt;ID of the team&amp;gt;&lt;br /&gt;
&lt;br /&gt;
2) expertiza.ncsu.edu/users/list&lt;br /&gt;
&lt;br /&gt;
== Project Design ==&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
For the purpose of this project, experts in the expertiza domain are Instructors. &lt;br /&gt;
&lt;br /&gt;
The following two patterns are implemented in the project - &lt;br /&gt;
&lt;br /&gt;
1.MVC Pattern - The project is implemented in Ruby on Rails that uses MVC architecture. It separates an application’s data model, user interface, and control logic into three distinct components (model, view, and controller, respectively). &lt;br /&gt;
&lt;br /&gt;
2.DRY Principle - We are trying to reuse the existing functionalities in Expertiza, thus avoiding code duplication. Whenever possible, code modification based on the existing classes, controllers, or tables will be done instead of creating the new one.&lt;br /&gt;
&lt;br /&gt;
3.Optimization - In order to optimize, we need to understand the factors which are causing the lag. This can be identified by using the flamegraph generation method and rack-mini-profiler statistics.&lt;br /&gt;
&lt;br /&gt;
==Approach==&lt;br /&gt;
To complete the given task, we identified the factors which are causing the lag. This was done by using flamegraph generation and rack-mini-profiler statistics. The statistics generated by rack miniprofiler helped us to understand the time taken by each component to get loaded. From these statistics, we identified the model/controller/view/database query which is causing this latency. From here, we identified the methods which needed to be implemented in order to optimize the webpage rendering.&lt;br /&gt;
&lt;br /&gt;
Optimization approach for the pages:&lt;br /&gt;
*users/list :- The approach to reduce loading time on this page was by implementing pagination. Instead of displaying all users and their data all at once, we display a certain number of users on one page, and rest of the users can be viewed by accessing the later pages. This reduces loading time of the page by reducing the amount of data to be fetched.&lt;br /&gt;
*grades/view : Ajax must be used for the optimization. Currently, all the data for all the teams present is loaded when the webpage is accessed. Instead, data for particular teams can be loaded when the user clicks on the expand button for that particular team. Thus, data for each team should be loaded asynchronously with ajax.&lt;br /&gt;
&lt;br /&gt;
==Identification of pages ==&lt;br /&gt;
===Analysis of page 1: expertiza.ncsu.edu/tree_display/list ===&lt;br /&gt;
&lt;br /&gt;
===FlameGraph Statistics===&lt;br /&gt;
The following is the flamegraph for this page:-&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:f.png]]&lt;br /&gt;
&lt;br /&gt;
The X axis of the FlameGraph represents the time taken to load the page. It can give a clear picture of where the expertiza page is getting bogged down. The widest layers take the longest to run. They’re the areas one should look into, because speeding them up could have the biggest impact. As we can see over here, most of the time taken over here is in the controller action.&lt;br /&gt;
&lt;br /&gt;
===MiniProfiler Statistics===&lt;br /&gt;
&lt;br /&gt;
The following is the rack-mini-profiler statistics for the page:-&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tre1.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
The box which is seen in the leftmost corner is the MiniProfiler statistics. MiniProfiler gives  a constant notification of how long each page takes to load. The miniprofiler statistics show the time taken to render the view as well as the corresponding SQL calls.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree2.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
This image shows the time and the number of SQL calls which are required for each rendering.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree5.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
Here as we can see the total number of SQL calls required for children_node_ng is 1123. This is causing the latency in the entire page by 10564.8 ms. These statistics helped us to identify the method which needs to be refactored.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree6.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
The total number of SQL calls required for 2 components here is 2 each. Hence we do not need to refactor this component.&lt;br /&gt;
&lt;br /&gt;
==  Solution ==&lt;br /&gt;
*users/list&lt;br /&gt;
The time taken to load the page was high because the server had to access through hundreds of rows in the database .The page was rendering the entire row of database at the same time. Pagination helped to split the database  into manageable chunks of data.&lt;br /&gt;
&lt;br /&gt;
*grades/view&lt;br /&gt;
The grades/view is the page where  the instructor accesses the grades statistics of each student.&lt;br /&gt;
The reason for  the slow down in the page is that the data for all the teams were loaded as soon as the page was loaded.The design of the page has an individual tab for each team, hence loading the entire data as soon as the page is loaded is quite redundant as the instructor needs to access the scores of each individual team at a given time.&lt;br /&gt;
The solution to this problem is to access the individual team statistics from the database when the instructor clicks the tab specified for the particular individual. &lt;br /&gt;
The existing code consists of a for loop in views/grades/_teams.html.erb, which renders the partial &amp;quot;views/grades/_tabbing.html.erb&amp;quot; which displays the data repeatedly. Instead, this partial could be rendered through AJAX or JQuery, whenever the expand button is clicked. This would save redundant loading of data and thus reduce the loading time of the page.&lt;br /&gt;
&lt;br /&gt;
Issues faced during implementation of this solution:- &lt;br /&gt;
&lt;br /&gt;
*While implementing this fix, we first created a controller method, which would render the required partial &amp;quot;views/grades/_tabbing.html.erb&amp;quot; when called. &lt;br /&gt;
*We passed the required data through the Rails params hash. However, since one argument that needed to be passed (tscore) is a Hash, when it enters the params hash, it is getting converted to a String. &lt;br /&gt;
*We tried passing the hash as it is, but after doing this all the data in the hash is not retained, i.e. there is a loss of data.&lt;br /&gt;
*We also tried converting the String back into Hash by using the eval method, and to_unsafe_h method.&lt;br /&gt;
*However, these methods require the hash to be present in a normal form i.e. key value pairs. &lt;br /&gt;
*But our hash has values as Objects, thus these methods cannot be applied&lt;br /&gt;
*Thus, we are unable to access the data in the String-hash. &lt;br /&gt;
*If this could be done, then our approach would result in successfully decreasing the loading time of the webpage.&lt;br /&gt;
&lt;br /&gt;
==Test Plan==&lt;br /&gt;
The project is based on optimizing the time required to load the pages which has been mentioned above,in order to test that there is an improvement in the time taken to load these pages one will have to compare the initial loading time and the time taken after the code has been modified.&lt;br /&gt;
&lt;br /&gt;
===Initial Setup for testing===&lt;br /&gt;
&lt;br /&gt;
1)Clone the git repository.&lt;br /&gt;
&lt;br /&gt;
2)Go to the commit on 3rd November(name: initial setup),this is the code which is originally provided by the professor and has not been modified. It however consists of the two gems required to check the loading time.&lt;br /&gt;
&lt;br /&gt;
3)To login as instructor :-&lt;br /&gt;
USERNAME :- instructor6&lt;br /&gt;
Password:- password&lt;br /&gt;
&lt;br /&gt;
===Testing===&lt;br /&gt;
&lt;br /&gt;
Check the time taken to load the page localhost:3000/tree_display/list on the left corner and compare the same for the latest pull. You will notice a substantial reduction in the loading time.&lt;br /&gt;
&lt;br /&gt;
===Automated Test===&lt;br /&gt;
&lt;br /&gt;
There can be no automated test for this program since the improvement in the performance is due to the inclusion of the pagination gem. &lt;br /&gt;
&lt;br /&gt;
Hence testing if the pagination gem will work is equivalent to checking if rails is working. &lt;br /&gt;
&lt;br /&gt;
As testing rails is not recommended  no automated test is added  for  changes made.&lt;/div&gt;</summary>
		<author><name>Krkulkar</name></author>
	</entry>
	<entry>
		<id>https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=113840</id>
		<title>CSC/ECE 517 Fall 2017/E17A8. Use a profiler to identify the problems / pages that take some time to load &amp; fix them</title>
		<link rel="alternate" type="text/html" href="https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=113840"/>
		<updated>2017-11-29T22:52:44Z</updated>

		<summary type="html">&lt;p&gt;Krkulkar: /* Testing */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;= Optimization for page loading in Expertiza =&lt;br /&gt;
&lt;br /&gt;
== Introduction ==&lt;br /&gt;
Expertiza is an online system that is used by students to view/submit assignments and review others' work. Expertiza also provides tools to visualize the scores and gauge the improvements made during the course semester. It also facilitates and monitors team projects. It is targeted at educational and non-profit organizations. The project is funded by the National Software Foundation (NSF), NCSU Learning in a Technology-Rich Environment (LITRE) program, the NCSU Faculty Center for Teaching and Learning, the NCSU STEM Initiative, and the Center for Advanced Computing and Communication.&lt;br /&gt;
&lt;br /&gt;
Expertiza is an open-source project with the source code available as a public repository on GitHub. It is developed using Ruby on Rails and is increasingly becoming robust thanks to the innumerable bugs being fixed by the community. The project has a micro-blog on SourceForge where the developer community report bugs and document updates.&lt;br /&gt;
&lt;br /&gt;
== Project Description ==&lt;br /&gt;
&lt;br /&gt;
1) Identifying the Expertiza pages which take time to load using Rack-mini-profiler and Flamegraphs.&lt;br /&gt;
&lt;br /&gt;
2) Propose fixes which would improve the Expertiza project.&lt;br /&gt;
&lt;br /&gt;
3) Optimizing the view, models and controllers for few of these corresponding fixes to improve the load time of these pages.&lt;br /&gt;
&lt;br /&gt;
== Gems Installed  ==&lt;br /&gt;
&lt;br /&gt;
*rack-mini-profiler :- Middleware that displays speed badge for every html page. Designed to work both in production and in development.&lt;br /&gt;
*flamegraphs :- Flame graphs are a visualization of profiled software, allowing the most frequent code-paths to be identified quickly and accurately.&lt;br /&gt;
*stackprof :- A sampling call-stack profiler for ruby 2.1+.Downloaded as a dependency for rack-mini-profiler.&lt;br /&gt;
*fast_stack :- fast_stack is dynamically resizable data structure optimized for fast iteration over the large arrays of similar elements avoiding memory fragmentation.&lt;br /&gt;
*Kaminari :- A Scope &amp;amp; Engine based, clean, powerful, customizable and sophisticated paginator for modern web app frameworks and ORMs.&lt;br /&gt;
&lt;br /&gt;
== Pages which needs to be optimized ==&lt;br /&gt;
&lt;br /&gt;
1) expertiza.ncsu.edu/grades/view?id=&amp;lt;ID of the team&amp;gt;&lt;br /&gt;
&lt;br /&gt;
2) expertiza.ncsu.edu/users/list&lt;br /&gt;
&lt;br /&gt;
== Project Design ==&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
For the purpose of this project, experts in the expertiza domain are Instructors. &lt;br /&gt;
&lt;br /&gt;
The following two patterns are implemented in the project - &lt;br /&gt;
&lt;br /&gt;
1.MVC Pattern - The project is implemented in Ruby on Rails that uses MVC architecture. It separates an application’s data model, user interface, and control logic into three distinct components (model, view, and controller, respectively). &lt;br /&gt;
&lt;br /&gt;
2.DRY Principle - We are trying to reuse the existing functionalities in Expertiza, thus avoiding code duplication. Whenever possible, code modification based on the existing classes, controllers, or tables will be done instead of creating the new one.&lt;br /&gt;
&lt;br /&gt;
3.Optimization - In order to optimize, we need to understand the factors which are causing the lag. This can be identified by using the flamegraph generation method and rack-mini-profiler statistics.&lt;br /&gt;
&lt;br /&gt;
==Approach==&lt;br /&gt;
To complete the given task, we identified the factors which are causing the lag. This was done by using flamegraph generation and rack-mini-profiler statistics. The statistics generated by rack miniprofiler helped us to understand the time taken by each component to get loaded. From these statistics, we identified the model/controller/view/database query which is causing this latency. From here, we identified the methods which needed to be implemented in order to optimize the webpage rendering.&lt;br /&gt;
&lt;br /&gt;
Optimization approach for the pages:&lt;br /&gt;
*users/list :- The approach to reduce loading time on this page was by implementing pagination. Instead of displaying all users and their data all at once, we display a certain number of users on one page, and rest of the users can be viewed by accessing the later pages. This reduces loading time of the page by reducing the amount of data to be fetched.&lt;br /&gt;
*grades/view : Ajax must be used for the optimization. Currently, all the data for all the teams present is loaded when the webpage is accessed. Instead, data for particular teams can be loaded when the user clicks on the expand button for that particular team. Thus, data for each team should be loaded asynchronously with ajax.&lt;br /&gt;
&lt;br /&gt;
==Identification of pages ==&lt;br /&gt;
===Analysis of page 1: expertiza.ncsu.edu/tree_display/list ===&lt;br /&gt;
&lt;br /&gt;
===FlameGraph Statistics===&lt;br /&gt;
The following is the flamegraph for this page:-&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:f.png]]&lt;br /&gt;
&lt;br /&gt;
The X axis of the FlameGraph represents the time taken to load the page. It can give a clear picture of where the expertiza page is getting bogged down. The widest layers take the longest to run. They’re the areas one should look into, because speeding them up could have the biggest impact. As we can see over here, most of the time taken over here is in the controller action.&lt;br /&gt;
&lt;br /&gt;
===MiniProfiler Statistics===&lt;br /&gt;
&lt;br /&gt;
The following is the rack-mini-profiler statistics for the page:-&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tre1.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
The box which is seen in the leftmost corner is the MiniProfiler statistics. MiniProfiler gives  a constant notification of how long each page takes to load. The miniprofiler statistics show the time taken to render the view as well as the corresponding SQL calls.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree2.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
This image shows the time and the number of SQL calls which are required for each rendering.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree5.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
Here as we can see the total number of SQL calls required for children_node_ng is 1123. This is causing the latency in the entire page by 10564.8 ms. These statistics helped us to identify the method which needs to be refactored.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree6.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
The total number of SQL calls required for 2 components here is 2 each. Hence we do not need to refactor this component.&lt;br /&gt;
&lt;br /&gt;
==  Solution ==&lt;br /&gt;
*users/list&lt;br /&gt;
The time taken to load the page was high because the server had to access through hundreds of rows in the database .The page was rendering the entire row of database at the same time. Pagination helped to split the database  into manageable chunks of data.&lt;br /&gt;
&lt;br /&gt;
*grades/view&lt;br /&gt;
The grades/view is the page where  the instructor accesses the grades statistics of each student.&lt;br /&gt;
The reason for  the slow down in the page is that the data for all the teams were loaded as soon as the page was loaded.The design of the page has an individual tab for each team, hence loading the entire data as soon as the page is loaded is quite redundant as the instructor needs to access the scores of each individual team at a given time.&lt;br /&gt;
The solution to this problem is to access the individual team statistics from the database when the instructor clicks the tab specified for the particular individual. &lt;br /&gt;
The existing code consists of a for loop in views/grades/_teams.html.erb, which renders the partial &amp;quot;views/grades/_tabbing.html.erb&amp;quot; which displays the data repeatedly. Instead, this partial could be rendered through AJAX or JQuery, whenever the expand button is clicked. This would save redundant loading of data and thus reduce the loading time of the page.&lt;br /&gt;
&lt;br /&gt;
Issues faced during implementation of this solution:- &lt;br /&gt;
&lt;br /&gt;
*While implementing this fix, we first created a controller method, which would render the required partial &amp;quot;views/grades/_tabbing.html.erb&amp;quot; when called. &lt;br /&gt;
*We passed the required data through the Rails params hash. However, since one argument that needed to be passed (tscore) is a Hash, when it enters the params hash, it is getting converted to a String. &lt;br /&gt;
*We tried passing the hash as it is, but after doing this all the data in the hash is not retained, i.e. there is a loss of data.&lt;br /&gt;
*We also tried converting the String back into Hash by using the eval method, and to_unsafe_h method.&lt;br /&gt;
*However, these methods require the hash to be present in a normal form i.e. key value pairs. &lt;br /&gt;
*But our hash has values as Objects, thus these methods cannot be applied&lt;br /&gt;
*Thus, we are unable to access the data in the String-hash. &lt;br /&gt;
*If this could be done, then our approach would result in successfully decreasing the loading time of the webpage.&lt;br /&gt;
&lt;br /&gt;
==Test Plan==&lt;br /&gt;
The project is based on optimizing the time required to load the pages which has been mentioned above,in order to test that there is an improvement in the time taken to load these pages one will have to compare the initial loading time and the time taken after the code has been modified.&lt;br /&gt;
&lt;br /&gt;
===Initial Setup for testing===&lt;br /&gt;
&lt;br /&gt;
1)Clone the git repository.&lt;br /&gt;
&lt;br /&gt;
2)Go to the commit on 3rd November(name: initial setup),this is the code which is originally provided by the professor and has not been modified. It however consists of the two gems required to check the loading time.&lt;br /&gt;
&lt;br /&gt;
3)To login as instructor :-&lt;br /&gt;
USERNAME :- instructor6&lt;br /&gt;
Password:- password&lt;br /&gt;
&lt;br /&gt;
===Testing===&lt;br /&gt;
&lt;br /&gt;
Check the time taken to load the page localhost:3000/tree_display/list on the left corner and compare the same for the latest pull. You will notice a substantial reduction in the loading time.&lt;br /&gt;
&lt;br /&gt;
===Automated Test===&lt;br /&gt;
&lt;br /&gt;
There can be no automated test for this program since the improvement in the performance is due to the inclusion of the pagination gem. &lt;br /&gt;
&lt;br /&gt;
Hence testing if the pagination gem will work is equivalent to checking if rails is working. &lt;br /&gt;
&lt;br /&gt;
As testing rails is not recommended  no automated test is added  for  changes made.&lt;/div&gt;</summary>
		<author><name>Krkulkar</name></author>
	</entry>
	<entry>
		<id>https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=113839</id>
		<title>CSC/ECE 517 Fall 2017/E17A8. Use a profiler to identify the problems / pages that take some time to load &amp; fix them</title>
		<link rel="alternate" type="text/html" href="https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=113839"/>
		<updated>2017-11-29T22:51:38Z</updated>

		<summary type="html">&lt;p&gt;Krkulkar: /* Testing */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;= Optimization for page loading in Expertiza =&lt;br /&gt;
&lt;br /&gt;
== Introduction ==&lt;br /&gt;
Expertiza is an online system that is used by students to view/submit assignments and review others' work. Expertiza also provides tools to visualize the scores and gauge the improvements made during the course semester. It also facilitates and monitors team projects. It is targeted at educational and non-profit organizations. The project is funded by the National Software Foundation (NSF), NCSU Learning in a Technology-Rich Environment (LITRE) program, the NCSU Faculty Center for Teaching and Learning, the NCSU STEM Initiative, and the Center for Advanced Computing and Communication.&lt;br /&gt;
&lt;br /&gt;
Expertiza is an open-source project with the source code available as a public repository on GitHub. It is developed using Ruby on Rails and is increasingly becoming robust thanks to the innumerable bugs being fixed by the community. The project has a micro-blog on SourceForge where the developer community report bugs and document updates.&lt;br /&gt;
&lt;br /&gt;
== Project Description ==&lt;br /&gt;
&lt;br /&gt;
1) Identifying the Expertiza pages which take time to load using Rack-mini-profiler and Flamegraphs.&lt;br /&gt;
&lt;br /&gt;
2) Propose fixes which would improve the Expertiza project.&lt;br /&gt;
&lt;br /&gt;
3) Optimizing the view, models and controllers for few of these corresponding fixes to improve the load time of these pages.&lt;br /&gt;
&lt;br /&gt;
== Gems Installed  ==&lt;br /&gt;
&lt;br /&gt;
*rack-mini-profiler :- Middleware that displays speed badge for every html page. Designed to work both in production and in development.&lt;br /&gt;
*flamegraphs :- Flame graphs are a visualization of profiled software, allowing the most frequent code-paths to be identified quickly and accurately.&lt;br /&gt;
*stackprof :- A sampling call-stack profiler for ruby 2.1+.Downloaded as a dependency for rack-mini-profiler.&lt;br /&gt;
*fast_stack :- fast_stack is dynamically resizable data structure optimized for fast iteration over the large arrays of similar elements avoiding memory fragmentation.&lt;br /&gt;
*Kaminari :- A Scope &amp;amp; Engine based, clean, powerful, customizable and sophisticated paginator for modern web app frameworks and ORMs.&lt;br /&gt;
&lt;br /&gt;
== Pages which needs to be optimized ==&lt;br /&gt;
&lt;br /&gt;
1) expertiza.ncsu.edu/grades/view?id=&amp;lt;ID of the team&amp;gt;&lt;br /&gt;
&lt;br /&gt;
2) expertiza.ncsu.edu/users/list&lt;br /&gt;
&lt;br /&gt;
== Project Design ==&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
For the purpose of this project, experts in the expertiza domain are Instructors. &lt;br /&gt;
&lt;br /&gt;
The following two patterns are implemented in the project - &lt;br /&gt;
&lt;br /&gt;
1.MVC Pattern - The project is implemented in Ruby on Rails that uses MVC architecture. It separates an application’s data model, user interface, and control logic into three distinct components (model, view, and controller, respectively). &lt;br /&gt;
&lt;br /&gt;
2.DRY Principle - We are trying to reuse the existing functionalities in Expertiza, thus avoiding code duplication. Whenever possible, code modification based on the existing classes, controllers, or tables will be done instead of creating the new one.&lt;br /&gt;
&lt;br /&gt;
3.Optimization - In order to optimize, we need to understand the factors which are causing the lag. This can be identified by using the flamegraph generation method and rack-mini-profiler statistics.&lt;br /&gt;
&lt;br /&gt;
==Approach==&lt;br /&gt;
To complete the given task, we identified the factors which are causing the lag. This was done by using flamegraph generation and rack-mini-profiler statistics. The statistics generated by rack miniprofiler helped us to understand the time taken by each component to get loaded. From these statistics, we identified the model/controller/view/database query which is causing this latency. From here, we identified the methods which needed to be implemented in order to optimize the webpage rendering.&lt;br /&gt;
&lt;br /&gt;
Optimization approach for the pages:&lt;br /&gt;
*users/list :- The approach to reduce loading time on this page was by implementing pagination. Instead of displaying all users and their data all at once, we display a certain number of users on one page, and rest of the users can be viewed by accessing the later pages. This reduces loading time of the page by reducing the amount of data to be fetched.&lt;br /&gt;
*grades/view : Ajax must be used for the optimization. Currently, all the data for all the teams present is loaded when the webpage is accessed. Instead, data for particular teams can be loaded when the user clicks on the expand button for that particular team. Thus, data for each team should be loaded asynchronously with ajax.&lt;br /&gt;
&lt;br /&gt;
==Identification of pages ==&lt;br /&gt;
===Analysis of page 1: expertiza.ncsu.edu/tree_display/list ===&lt;br /&gt;
&lt;br /&gt;
===FlameGraph Statistics===&lt;br /&gt;
The following is the flamegraph for this page:-&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:f.png]]&lt;br /&gt;
&lt;br /&gt;
The X axis of the FlameGraph represents the time taken to load the page. It can give a clear picture of where the expertiza page is getting bogged down. The widest layers take the longest to run. They’re the areas one should look into, because speeding them up could have the biggest impact. As we can see over here, most of the time taken over here is in the controller action.&lt;br /&gt;
&lt;br /&gt;
===MiniProfiler Statistics===&lt;br /&gt;
&lt;br /&gt;
The following is the rack-mini-profiler statistics for the page:-&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tre1.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
The box which is seen in the leftmost corner is the MiniProfiler statistics. MiniProfiler gives  a constant notification of how long each page takes to load. The miniprofiler statistics show the time taken to render the view as well as the corresponding SQL calls.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree2.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
This image shows the time and the number of SQL calls which are required for each rendering.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree5.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
Here as we can see the total number of SQL calls required for children_node_ng is 1123. This is causing the latency in the entire page by 10564.8 ms. These statistics helped us to identify the method which needs to be refactored.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree6.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
The total number of SQL calls required for 2 components here is 2 each. Hence we do not need to refactor this component.&lt;br /&gt;
&lt;br /&gt;
==  Solution ==&lt;br /&gt;
*users/list&lt;br /&gt;
The time taken to load the page was high because the server had to access through hundreds of rows in the database .The page was rendering the entire row of database at the same time. Pagination helped to split the database  into manageable chunks of data.&lt;br /&gt;
&lt;br /&gt;
*grades/view&lt;br /&gt;
The grades/view is the page where  the instructor accesses the grades statistics of each student.&lt;br /&gt;
The reason for  the slow down in the page is that the data for all the teams were loaded as soon as the page was loaded.The design of the page has an individual tab for each team, hence loading the entire data as soon as the page is loaded is quite redundant as the instructor needs to access the scores of each individual team at a given time.&lt;br /&gt;
The solution to this problem is to access the individual team statistics from the database when the instructor clicks the tab specified for the particular individual. &lt;br /&gt;
The existing code consists of a for loop in views/grades/_teams.html.erb, which renders the partial &amp;quot;views/grades/_tabbing.html.erb&amp;quot; which displays the data repeatedly. Instead, this partial could be rendered through AJAX or JQuery, whenever the expand button is clicked. This would save redundant loading of data and thus reduce the loading time of the page.&lt;br /&gt;
&lt;br /&gt;
Issues faced during implementation of this solution:- &lt;br /&gt;
&lt;br /&gt;
*While implementing this fix, we first created a controller method, which would render the required partial &amp;quot;views/grades/_tabbing.html.erb&amp;quot; when called. &lt;br /&gt;
*We passed the required data through the Rails params hash. However, since one argument that needed to be passed (tscore) is a Hash, when it enters the params hash, it is getting converted to a String. &lt;br /&gt;
*We tried passing the hash as it is, but after doing this all the data in the hash is not retained, i.e. there is a loss of data.&lt;br /&gt;
*We also tried converting the String back into Hash by using the eval method, and to_unsafe_h method.&lt;br /&gt;
*However, these methods require the hash to be present in a normal form i.e. key value pairs. &lt;br /&gt;
*But our hash has values as Objects, thus these methods cannot be applied&lt;br /&gt;
*Thus, we are unable to access the data in the String-hash. &lt;br /&gt;
*If this could be done, then our approach would result in successfully decreasing the loading time of the webpage.&lt;br /&gt;
&lt;br /&gt;
==Test Plan==&lt;br /&gt;
The project is based on optimizing the time required to load the pages which has been mentioned above,in order to test that there is an improvement in the time taken to load these pages one will have to compare the initial loading time and the time taken after the code has been modified.&lt;br /&gt;
&lt;br /&gt;
===Initial Setup for testing===&lt;br /&gt;
&lt;br /&gt;
1)Clone the git repository.&lt;br /&gt;
&lt;br /&gt;
2)Go to the commit on 3rd November(name: initial setup),this is the code which is originally provided by the professor and has not been modified. It however consists of the two gems required to check the loading time.&lt;br /&gt;
&lt;br /&gt;
3)To login as instructor :-&lt;br /&gt;
USERNAME :- instructor6&lt;br /&gt;
Password:- password&lt;br /&gt;
&lt;br /&gt;
===Testing===&lt;br /&gt;
&lt;br /&gt;
1)Check the time taken to load the page localhost:3000/tree_display/list on the left corner and compare the same for the latest pull. You will notice a substantial reduction in the loading time.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
2)Check the time taken to load the page localhost:3000/review_mapping/response_report on the left corner and compare the same for the latest pull. You will notice a substantial reduction in the loading time.&lt;br /&gt;
&lt;br /&gt;
===Automated Test===&lt;br /&gt;
&lt;br /&gt;
There can be no automated test for this program since the improvement in the performance is due to the inclusion of the pagination gem. &lt;br /&gt;
&lt;br /&gt;
Hence testing if the pagination gem will work is equivalent to checking if rails is working. &lt;br /&gt;
&lt;br /&gt;
As testing rails is not recommended  no automated test is added  for  changes made.&lt;/div&gt;</summary>
		<author><name>Krkulkar</name></author>
	</entry>
	<entry>
		<id>https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=113838</id>
		<title>CSC/ECE 517 Fall 2017/E17A8. Use a profiler to identify the problems / pages that take some time to load &amp; fix them</title>
		<link rel="alternate" type="text/html" href="https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=113838"/>
		<updated>2017-11-29T22:49:10Z</updated>

		<summary type="html">&lt;p&gt;Krkulkar: /* Test Plan */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;= Optimization for page loading in Expertiza =&lt;br /&gt;
&lt;br /&gt;
== Introduction ==&lt;br /&gt;
Expertiza is an online system that is used by students to view/submit assignments and review others' work. Expertiza also provides tools to visualize the scores and gauge the improvements made during the course semester. It also facilitates and monitors team projects. It is targeted at educational and non-profit organizations. The project is funded by the National Software Foundation (NSF), NCSU Learning in a Technology-Rich Environment (LITRE) program, the NCSU Faculty Center for Teaching and Learning, the NCSU STEM Initiative, and the Center for Advanced Computing and Communication.&lt;br /&gt;
&lt;br /&gt;
Expertiza is an open-source project with the source code available as a public repository on GitHub. It is developed using Ruby on Rails and is increasingly becoming robust thanks to the innumerable bugs being fixed by the community. The project has a micro-blog on SourceForge where the developer community report bugs and document updates.&lt;br /&gt;
&lt;br /&gt;
== Project Description ==&lt;br /&gt;
&lt;br /&gt;
1) Identifying the Expertiza pages which take time to load using Rack-mini-profiler and Flamegraphs.&lt;br /&gt;
&lt;br /&gt;
2) Propose fixes which would improve the Expertiza project.&lt;br /&gt;
&lt;br /&gt;
3) Optimizing the view, models and controllers for few of these corresponding fixes to improve the load time of these pages.&lt;br /&gt;
&lt;br /&gt;
== Gems Installed  ==&lt;br /&gt;
&lt;br /&gt;
*rack-mini-profiler :- Middleware that displays speed badge for every html page. Designed to work both in production and in development.&lt;br /&gt;
*flamegraphs :- Flame graphs are a visualization of profiled software, allowing the most frequent code-paths to be identified quickly and accurately.&lt;br /&gt;
*stackprof :- A sampling call-stack profiler for ruby 2.1+.Downloaded as a dependency for rack-mini-profiler.&lt;br /&gt;
*fast_stack :- fast_stack is dynamically resizable data structure optimized for fast iteration over the large arrays of similar elements avoiding memory fragmentation.&lt;br /&gt;
*Kaminari :- A Scope &amp;amp; Engine based, clean, powerful, customizable and sophisticated paginator for modern web app frameworks and ORMs.&lt;br /&gt;
&lt;br /&gt;
== Pages which needs to be optimized ==&lt;br /&gt;
&lt;br /&gt;
1) expertiza.ncsu.edu/grades/view?id=&amp;lt;ID of the team&amp;gt;&lt;br /&gt;
&lt;br /&gt;
2) expertiza.ncsu.edu/users/list&lt;br /&gt;
&lt;br /&gt;
== Project Design ==&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
For the purpose of this project, experts in the expertiza domain are Instructors. &lt;br /&gt;
&lt;br /&gt;
The following two patterns are implemented in the project - &lt;br /&gt;
&lt;br /&gt;
1.MVC Pattern - The project is implemented in Ruby on Rails that uses MVC architecture. It separates an application’s data model, user interface, and control logic into three distinct components (model, view, and controller, respectively). &lt;br /&gt;
&lt;br /&gt;
2.DRY Principle - We are trying to reuse the existing functionalities in Expertiza, thus avoiding code duplication. Whenever possible, code modification based on the existing classes, controllers, or tables will be done instead of creating the new one.&lt;br /&gt;
&lt;br /&gt;
3.Optimization - In order to optimize, we need to understand the factors which are causing the lag. This can be identified by using the flamegraph generation method and rack-mini-profiler statistics.&lt;br /&gt;
&lt;br /&gt;
==Approach==&lt;br /&gt;
To complete the given task, we identified the factors which are causing the lag. This was done by using flamegraph generation and rack-mini-profiler statistics. The statistics generated by rack miniprofiler helped us to understand the time taken by each component to get loaded. From these statistics, we identified the model/controller/view/database query which is causing this latency. From here, we identified the methods which needed to be implemented in order to optimize the webpage rendering.&lt;br /&gt;
&lt;br /&gt;
Optimization approach for the pages:&lt;br /&gt;
*users/list :- The approach to reduce loading time on this page was by implementing pagination. Instead of displaying all users and their data all at once, we display a certain number of users on one page, and rest of the users can be viewed by accessing the later pages. This reduces loading time of the page by reducing the amount of data to be fetched.&lt;br /&gt;
*grades/view : Ajax must be used for the optimization. Currently, all the data for all the teams present is loaded when the webpage is accessed. Instead, data for particular teams can be loaded when the user clicks on the expand button for that particular team. Thus, data for each team should be loaded asynchronously with ajax.&lt;br /&gt;
&lt;br /&gt;
==Identification of pages ==&lt;br /&gt;
===Analysis of page 1: expertiza.ncsu.edu/tree_display/list ===&lt;br /&gt;
&lt;br /&gt;
===FlameGraph Statistics===&lt;br /&gt;
The following is the flamegraph for this page:-&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:f.png]]&lt;br /&gt;
&lt;br /&gt;
The X axis of the FlameGraph represents the time taken to load the page. It can give a clear picture of where the expertiza page is getting bogged down. The widest layers take the longest to run. They’re the areas one should look into, because speeding them up could have the biggest impact. As we can see over here, most of the time taken over here is in the controller action.&lt;br /&gt;
&lt;br /&gt;
===MiniProfiler Statistics===&lt;br /&gt;
&lt;br /&gt;
The following is the rack-mini-profiler statistics for the page:-&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tre1.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
The box which is seen in the leftmost corner is the MiniProfiler statistics. MiniProfiler gives  a constant notification of how long each page takes to load. The miniprofiler statistics show the time taken to render the view as well as the corresponding SQL calls.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree2.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
This image shows the time and the number of SQL calls which are required for each rendering.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree5.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
Here as we can see the total number of SQL calls required for children_node_ng is 1123. This is causing the latency in the entire page by 10564.8 ms. These statistics helped us to identify the method which needs to be refactored.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree6.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
The total number of SQL calls required for 2 components here is 2 each. Hence we do not need to refactor this component.&lt;br /&gt;
&lt;br /&gt;
==  Solution ==&lt;br /&gt;
*users/list&lt;br /&gt;
The time taken to load the page was high because the server had to access through hundreds of rows in the database .The page was rendering the entire row of database at the same time. Pagination helped to split the database  into manageable chunks of data.&lt;br /&gt;
&lt;br /&gt;
*grades/view&lt;br /&gt;
The grades/view is the page where  the instructor accesses the grades statistics of each student.&lt;br /&gt;
The reason for  the slow down in the page is that the data for all the teams were loaded as soon as the page was loaded.The design of the page has an individual tab for each team, hence loading the entire data as soon as the page is loaded is quite redundant as the instructor needs to access the scores of each individual team at a given time.&lt;br /&gt;
The solution to this problem is to access the individual team statistics from the database when the instructor clicks the tab specified for the particular individual. &lt;br /&gt;
The existing code consists of a for loop in views/grades/_teams.html.erb, which renders the partial &amp;quot;views/grades/_tabbing.html.erb&amp;quot; which displays the data repeatedly. Instead, this partial could be rendered through AJAX or JQuery, whenever the expand button is clicked. This would save redundant loading of data and thus reduce the loading time of the page.&lt;br /&gt;
&lt;br /&gt;
Issues faced during implementation of this solution:- &lt;br /&gt;
&lt;br /&gt;
*While implementing this fix, we first created a controller method, which would render the required partial &amp;quot;views/grades/_tabbing.html.erb&amp;quot; when called. &lt;br /&gt;
*We passed the required data through the Rails params hash. However, since one argument that needed to be passed (tscore) is a Hash, when it enters the params hash, it is getting converted to a String. &lt;br /&gt;
*We tried passing the hash as it is, but after doing this all the data in the hash is not retained, i.e. there is a loss of data.&lt;br /&gt;
*We also tried converting the String back into Hash by using the eval method, and to_unsafe_h method.&lt;br /&gt;
*However, these methods require the hash to be present in a normal form i.e. key value pairs. &lt;br /&gt;
*But our hash has values as Objects, thus these methods cannot be applied&lt;br /&gt;
*Thus, we are unable to access the data in the String-hash. &lt;br /&gt;
*If this could be done, then our approach would result in successfully decreasing the loading time of the webpage.&lt;br /&gt;
&lt;br /&gt;
==Test Plan==&lt;br /&gt;
The project is based on optimizing the time required to load the pages which has been mentioned above,in order to test that there is an improvement in the time taken to load these pages one will have to compare the initial loading time and the time taken after the code has been modified.&lt;br /&gt;
&lt;br /&gt;
===Initial Setup for testing===&lt;br /&gt;
&lt;br /&gt;
1)Clone the git repository.&lt;br /&gt;
&lt;br /&gt;
2)Go to the commit on 3rd November(name: initial setup),this is the code which is originally provided by the professor and has not been modified. It however consists of the two gems required to check the loading time.&lt;br /&gt;
&lt;br /&gt;
3)To login as instructor :-&lt;br /&gt;
USERNAME :- instructor6&lt;br /&gt;
Password:- password&lt;br /&gt;
&lt;br /&gt;
===Testing===&lt;br /&gt;
&lt;br /&gt;
1)Check the time taken to load the page localhost:3000/tree_display/list on the left corner and compare the same for the latest pull,a substantial difference in the loading time.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
2)Check the time taken to load the page localhost:3000/review_mapping/response_report on the left corner and compare the same for the latest pull,a substantial difference in the loading time.&lt;br /&gt;
&lt;br /&gt;
===Automated Test===&lt;br /&gt;
&lt;br /&gt;
There can be no automated test for this program since the improvement in the performance is due to the inclusion of the pagination gem. &lt;br /&gt;
&lt;br /&gt;
Hence testing if the pagination gem will work is equivalent to checking if rails is working. &lt;br /&gt;
&lt;br /&gt;
As testing rails is not recommended  no automated test is added  for  changes made.&lt;/div&gt;</summary>
		<author><name>Krkulkar</name></author>
	</entry>
	<entry>
		<id>https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=113835</id>
		<title>CSC/ECE 517 Fall 2017/E17A8. Use a profiler to identify the problems / pages that take some time to load &amp; fix them</title>
		<link rel="alternate" type="text/html" href="https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=113835"/>
		<updated>2017-11-29T22:47:14Z</updated>

		<summary type="html">&lt;p&gt;Krkulkar: /* Approach */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;= Optimization for page loading in Expertiza =&lt;br /&gt;
&lt;br /&gt;
== Introduction ==&lt;br /&gt;
Expertiza is an online system that is used by students to view/submit assignments and review others' work. Expertiza also provides tools to visualize the scores and gauge the improvements made during the course semester. It also facilitates and monitors team projects. It is targeted at educational and non-profit organizations. The project is funded by the National Software Foundation (NSF), NCSU Learning in a Technology-Rich Environment (LITRE) program, the NCSU Faculty Center for Teaching and Learning, the NCSU STEM Initiative, and the Center for Advanced Computing and Communication.&lt;br /&gt;
&lt;br /&gt;
Expertiza is an open-source project with the source code available as a public repository on GitHub. It is developed using Ruby on Rails and is increasingly becoming robust thanks to the innumerable bugs being fixed by the community. The project has a micro-blog on SourceForge where the developer community report bugs and document updates.&lt;br /&gt;
&lt;br /&gt;
== Project Description ==&lt;br /&gt;
&lt;br /&gt;
1) Identifying the Expertiza pages which take time to load using Rack-mini-profiler and Flamegraphs.&lt;br /&gt;
&lt;br /&gt;
2) Propose fixes which would improve the Expertiza project.&lt;br /&gt;
&lt;br /&gt;
3) Optimizing the view, models and controllers for few of these corresponding fixes to improve the load time of these pages.&lt;br /&gt;
&lt;br /&gt;
== Gems Installed  ==&lt;br /&gt;
&lt;br /&gt;
*rack-mini-profiler :- Middleware that displays speed badge for every html page. Designed to work both in production and in development.&lt;br /&gt;
*flamegraphs :- Flame graphs are a visualization of profiled software, allowing the most frequent code-paths to be identified quickly and accurately.&lt;br /&gt;
*stackprof :- A sampling call-stack profiler for ruby 2.1+.Downloaded as a dependency for rack-mini-profiler.&lt;br /&gt;
*fast_stack :- fast_stack is dynamically resizable data structure optimized for fast iteration over the large arrays of similar elements avoiding memory fragmentation.&lt;br /&gt;
*Kaminari :- A Scope &amp;amp; Engine based, clean, powerful, customizable and sophisticated paginator for modern web app frameworks and ORMs.&lt;br /&gt;
&lt;br /&gt;
== Pages which needs to be optimized ==&lt;br /&gt;
&lt;br /&gt;
1) expertiza.ncsu.edu/grades/view?id=&amp;lt;ID of the team&amp;gt;&lt;br /&gt;
&lt;br /&gt;
2) expertiza.ncsu.edu/users/list&lt;br /&gt;
&lt;br /&gt;
== Project Design ==&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
For the purpose of this project, experts in the expertiza domain are Instructors. &lt;br /&gt;
&lt;br /&gt;
The following two patterns are implemented in the project - &lt;br /&gt;
&lt;br /&gt;
1.MVC Pattern - The project is implemented in Ruby on Rails that uses MVC architecture. It separates an application’s data model, user interface, and control logic into three distinct components (model, view, and controller, respectively). &lt;br /&gt;
&lt;br /&gt;
2.DRY Principle - We are trying to reuse the existing functionalities in Expertiza, thus avoiding code duplication. Whenever possible, code modification based on the existing classes, controllers, or tables will be done instead of creating the new one.&lt;br /&gt;
&lt;br /&gt;
3.Optimization - In order to optimize, we need to understand the factors which are causing the lag. This can be identified by using the flamegraph generation method and rack-mini-profiler statistics.&lt;br /&gt;
&lt;br /&gt;
==Approach==&lt;br /&gt;
To complete the given task, we identified the factors which are causing the lag. This was done by using flamegraph generation and rack-mini-profiler statistics. The statistics generated by rack miniprofiler helped us to understand the time taken by each component to get loaded. From these statistics, we identified the model/controller/view/database query which is causing this latency. From here, we identified the methods which needed to be implemented in order to optimize the webpage rendering.&lt;br /&gt;
&lt;br /&gt;
Optimization approach for the pages:&lt;br /&gt;
*users/list :- The approach to reduce loading time on this page was by implementing pagination. Instead of displaying all users and their data all at once, we display a certain number of users on one page, and rest of the users can be viewed by accessing the later pages. This reduces loading time of the page by reducing the amount of data to be fetched.&lt;br /&gt;
*grades/view : Ajax must be used for the optimization. Currently, all the data for all the teams present is loaded when the webpage is accessed. Instead, data for particular teams can be loaded when the user clicks on the expand button for that particular team. Thus, data for each team should be loaded asynchronously with ajax.&lt;br /&gt;
&lt;br /&gt;
==Identification of pages ==&lt;br /&gt;
===Analysis of page 1: expertiza.ncsu.edu/tree_display/list ===&lt;br /&gt;
&lt;br /&gt;
===FlameGraph Statistics===&lt;br /&gt;
The following is the flamegraph for this page:-&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:f.png]]&lt;br /&gt;
&lt;br /&gt;
The X axis of the FlameGraph represents the time taken to load the page. It can give a clear picture of where the expertiza page is getting bogged down. The widest layers take the longest to run. They’re the areas one should look into, because speeding them up could have the biggest impact. As we can see over here, most of the time taken over here is in the controller action.&lt;br /&gt;
&lt;br /&gt;
===MiniProfiler Statistics===&lt;br /&gt;
&lt;br /&gt;
The following is the rack-mini-profiler statistics for the page:-&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tre1.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
The box which is seen in the leftmost corner is the MiniProfiler statistics. MiniProfiler gives  a constant notification of how long each page takes to load. The miniprofiler statistics show the time taken to render the view as well as the corresponding SQL calls.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree2.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
This image shows the time and the number of SQL calls which are required for each rendering.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree5.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
Here as we can see the total number of SQL calls required for children_node_ng is 1123. This is causing the latency in the entire page by 10564.8 ms. These statistics helped us to identify the method which needs to be refactored.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree6.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
The total number of SQL calls required for 2 components here is 2 each. Hence we do not need to refactor this component.&lt;br /&gt;
&lt;br /&gt;
===Identified Component causing the delay===&lt;br /&gt;
tree_display_controller&lt;br /&gt;
&lt;br /&gt;
The following methods are consuming most of the time in this code :-&lt;br /&gt;
&lt;br /&gt;
1)update_fnode_children&lt;br /&gt;
&lt;br /&gt;
2)initialize_fnode_update_children&lt;br /&gt;
&lt;br /&gt;
3)children_node_ng&lt;br /&gt;
&lt;br /&gt;
These methods are from line 172-201 in this controller.&lt;br /&gt;
&lt;br /&gt;
==  Solution ==&lt;br /&gt;
*users/list&lt;br /&gt;
The time taken to load the page was high because the server had to access through hundreds of rows in the database .The page was rendering the entire row of database at the same time. Pagination helped to split the database  into manageable chunks of data.&lt;br /&gt;
&lt;br /&gt;
*grades/view&lt;br /&gt;
The grades/view is the page where  the instructor accesses the grades statistics of each student.&lt;br /&gt;
The reason for  the slow down in the page is that the data for all the teams were loaded as soon as the page was loaded.The design of the page has an individual tab for each team, hence loading the entire data as soon as the page is loaded is quite redundant as the instructor needs to access the scores of each individual team at a given time.&lt;br /&gt;
The solution to this problem is to access the individual team statistics from the database when the instructor clicks the tab specified for the particular individual. &lt;br /&gt;
&lt;br /&gt;
Issues faced during implementation of this solution:- &lt;br /&gt;
1)&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
2)&lt;br /&gt;
&lt;br /&gt;
==Test Plan==&lt;br /&gt;
The project is based on optimizing the time required to load the pages which has been mentioned above,in order to test that there is an improvement in the time taken to load these pages one will have to compare the initial loading time and the time taken after the code has been modified.&lt;br /&gt;
&lt;br /&gt;
===Initial Setup for testing===&lt;br /&gt;
&lt;br /&gt;
1)Clone the git repository.&lt;br /&gt;
&lt;br /&gt;
2)Go to the commit on 3rd November(name: initial setup),this is the code which is originally provided by the professor and has not been modified. It however consists of the two gems required to check the loading time.&lt;br /&gt;
&lt;br /&gt;
3)To login as instructor :-&lt;br /&gt;
USERNAME :- instructor6&lt;br /&gt;
Password:-password&lt;br /&gt;
&lt;br /&gt;
===Testing===&lt;br /&gt;
&lt;br /&gt;
1)Check the time taken to load the page localhost:3000/tree_display/list on the left corner and compare the same for the latest pull,a substantial difference in the loading time.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
2)Check the time taken to load the page localhost:3000/review_mapping/response_report on the left corner and compare the same for the latest pull,a substantial difference in the loading time.&lt;br /&gt;
&lt;br /&gt;
===Automated Test===&lt;br /&gt;
&lt;br /&gt;
There can be no automated test for this program since the improvement in the performance is due to the inclusion of the pagination gem. &lt;br /&gt;
&lt;br /&gt;
Hence testing if the pagination gem will work is equivalent to checking if rails is working. &lt;br /&gt;
&lt;br /&gt;
As testing rails is not recommended  no automated test is added  for  changes made.&lt;/div&gt;</summary>
		<author><name>Krkulkar</name></author>
	</entry>
	<entry>
		<id>https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=113834</id>
		<title>CSC/ECE 517 Fall 2017/E17A8. Use a profiler to identify the problems / pages that take some time to load &amp; fix them</title>
		<link rel="alternate" type="text/html" href="https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=113834"/>
		<updated>2017-11-29T22:44:23Z</updated>

		<summary type="html">&lt;p&gt;Krkulkar: /* Gems Installed */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;= Optimization for page loading in Expertiza =&lt;br /&gt;
&lt;br /&gt;
== Introduction ==&lt;br /&gt;
Expertiza is an online system that is used by students to view/submit assignments and review others' work. Expertiza also provides tools to visualize the scores and gauge the improvements made during the course semester. It also facilitates and monitors team projects. It is targeted at educational and non-profit organizations. The project is funded by the National Software Foundation (NSF), NCSU Learning in a Technology-Rich Environment (LITRE) program, the NCSU Faculty Center for Teaching and Learning, the NCSU STEM Initiative, and the Center for Advanced Computing and Communication.&lt;br /&gt;
&lt;br /&gt;
Expertiza is an open-source project with the source code available as a public repository on GitHub. It is developed using Ruby on Rails and is increasingly becoming robust thanks to the innumerable bugs being fixed by the community. The project has a micro-blog on SourceForge where the developer community report bugs and document updates.&lt;br /&gt;
&lt;br /&gt;
== Project Description ==&lt;br /&gt;
&lt;br /&gt;
1) Identifying the Expertiza pages which take time to load using Rack-mini-profiler and Flamegraphs.&lt;br /&gt;
&lt;br /&gt;
2) Propose fixes which would improve the Expertiza project.&lt;br /&gt;
&lt;br /&gt;
3) Optimizing the view, models and controllers for few of these corresponding fixes to improve the load time of these pages.&lt;br /&gt;
&lt;br /&gt;
== Gems Installed  ==&lt;br /&gt;
&lt;br /&gt;
*rack-mini-profiler :- Middleware that displays speed badge for every html page. Designed to work both in production and in development.&lt;br /&gt;
*flamegraphs :- Flame graphs are a visualization of profiled software, allowing the most frequent code-paths to be identified quickly and accurately.&lt;br /&gt;
*stackprof :- A sampling call-stack profiler for ruby 2.1+.Downloaded as a dependency for rack-mini-profiler.&lt;br /&gt;
*fast_stack :- fast_stack is dynamically resizable data structure optimized for fast iteration over the large arrays of similar elements avoiding memory fragmentation.&lt;br /&gt;
*Kaminari :- A Scope &amp;amp; Engine based, clean, powerful, customizable and sophisticated paginator for modern web app frameworks and ORMs.&lt;br /&gt;
&lt;br /&gt;
== Pages which needs to be optimized ==&lt;br /&gt;
&lt;br /&gt;
1) expertiza.ncsu.edu/grades/view?id=&amp;lt;ID of the team&amp;gt;&lt;br /&gt;
&lt;br /&gt;
2) expertiza.ncsu.edu/users/list&lt;br /&gt;
&lt;br /&gt;
== Project Design ==&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
For the purpose of this project, experts in the expertiza domain are Instructors. &lt;br /&gt;
&lt;br /&gt;
The following two patterns are implemented in the project - &lt;br /&gt;
&lt;br /&gt;
1.MVC Pattern - The project is implemented in Ruby on Rails that uses MVC architecture. It separates an application’s data model, user interface, and control logic into three distinct components (model, view, and controller, respectively). &lt;br /&gt;
&lt;br /&gt;
2.DRY Principle - We are trying to reuse the existing functionalities in Expertiza, thus avoiding code duplication. Whenever possible, code modification based on the existing classes, controllers, or tables will be done instead of creating the new one.&lt;br /&gt;
&lt;br /&gt;
3.Optimization - In order to optimize, we need to understand the factors which are causing the lag. This can be identified by using the flamegraph generation method and rack-mini-profiler statistics.&lt;br /&gt;
&lt;br /&gt;
==Approach==&lt;br /&gt;
To complete the given task, we identified the factors which are causing the lag. This was done by using flamegraph generation and rack-mini-profiler statistics. The statistics generated by rack miniprofiler helped us to understand the time taken by each component to get loaded. From these statistics, we identified the model/controller/view/database query which is causing this latency. From here, we identified the methods which needed to be implemented in order to optimize the webpage rendering.&lt;br /&gt;
&lt;br /&gt;
Optimization approach for the pages:&lt;br /&gt;
*users/list :- Pagination was used to optimze. This was done using the Kaminari gem for Rails.&lt;br /&gt;
*grades/view : Ajax must be used for the optimization. Currently, all the data for all the teams present is loaded when the webpage is accessed. Instead, data for particular teams can be loaded when the user clicks on the expand button for that particular team. Thus, data for each team should be loaded asynchronously with ajax.&lt;br /&gt;
&lt;br /&gt;
==Identification of pages ==&lt;br /&gt;
===Analysis of page 1: expertiza.ncsu.edu/tree_display/list ===&lt;br /&gt;
&lt;br /&gt;
===FlameGraph Statistics===&lt;br /&gt;
The following is the flamegraph for this page:-&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:f.png]]&lt;br /&gt;
&lt;br /&gt;
The X axis of the FlameGraph represents the time taken to load the page. It can give a clear picture of where the expertiza page is getting bogged down. The widest layers take the longest to run. They’re the areas one should look into, because speeding them up could have the biggest impact. As we can see over here, most of the time taken over here is in the controller action.&lt;br /&gt;
&lt;br /&gt;
===MiniProfiler Statistics===&lt;br /&gt;
&lt;br /&gt;
The following is the rack-mini-profiler statistics for the page:-&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tre1.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
The box which is seen in the leftmost corner is the MiniProfiler statistics. MiniProfiler gives  a constant notification of how long each page takes to load. The miniprofiler statistics show the time taken to render the view as well as the corresponding SQL calls.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree2.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
This image shows the time and the number of SQL calls which are required for each rendering.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree5.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
Here as we can see the total number of SQL calls required for children_node_ng is 1123. This is causing the latency in the entire page by 10564.8 ms. These statistics helped us to identify the method which needs to be refactored.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree6.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
The total number of SQL calls required for 2 components here is 2 each. Hence we do not need to refactor this component.&lt;br /&gt;
&lt;br /&gt;
===Identified Component causing the delay===&lt;br /&gt;
tree_display_controller&lt;br /&gt;
&lt;br /&gt;
The following methods are consuming most of the time in this code :-&lt;br /&gt;
&lt;br /&gt;
1)update_fnode_children&lt;br /&gt;
&lt;br /&gt;
2)initialize_fnode_update_children&lt;br /&gt;
&lt;br /&gt;
3)children_node_ng&lt;br /&gt;
&lt;br /&gt;
These methods are from line 172-201 in this controller.&lt;br /&gt;
&lt;br /&gt;
==  Solution ==&lt;br /&gt;
*users/list&lt;br /&gt;
The time taken to load the page was high because the server had to access through hundreds of rows in the database .The page was rendering the entire row of database at the same time. Pagination helped to split the database  into manageable chunks of data.&lt;br /&gt;
&lt;br /&gt;
*grades/view&lt;br /&gt;
The grades/view is the page where  the instructor accesses the grades statistics of each student.&lt;br /&gt;
The reason for  the slow down in the page is that the data for all the teams were loaded as soon as the page was loaded.The design of the page has an individual tab for each team, hence loading the entire data as soon as the page is loaded is quite redundant as the instructor needs to access the scores of each individual team at a given time.&lt;br /&gt;
The solution to this problem is to access the individual team statistics from the database when the instructor clicks the tab specified for the particular individual. &lt;br /&gt;
&lt;br /&gt;
Issues faced during implementation of this solution:- &lt;br /&gt;
1)&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
2)&lt;br /&gt;
&lt;br /&gt;
==Test Plan==&lt;br /&gt;
The project is based on optimizing the time required to load the pages which has been mentioned above,in order to test that there is an improvement in the time taken to load these pages one will have to compare the initial loading time and the time taken after the code has been modified.&lt;br /&gt;
&lt;br /&gt;
===Initial Setup for testing===&lt;br /&gt;
&lt;br /&gt;
1)Clone the git repository.&lt;br /&gt;
&lt;br /&gt;
2)Go to the commit on 3rd November(name: initial setup),this is the code which is originally provided by the professor and has not been modified. It however consists of the two gems required to check the loading time.&lt;br /&gt;
&lt;br /&gt;
3)To login as instructor :-&lt;br /&gt;
USERNAME :- instructor6&lt;br /&gt;
Password:-password&lt;br /&gt;
&lt;br /&gt;
===Testing===&lt;br /&gt;
&lt;br /&gt;
1)Check the time taken to load the page localhost:3000/tree_display/list on the left corner and compare the same for the latest pull,a substantial difference in the loading time.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
2)Check the time taken to load the page localhost:3000/review_mapping/response_report on the left corner and compare the same for the latest pull,a substantial difference in the loading time.&lt;br /&gt;
&lt;br /&gt;
===Automated Test===&lt;br /&gt;
&lt;br /&gt;
There can be no automated test for this program since the improvement in the performance is due to the inclusion of the pagination gem. &lt;br /&gt;
&lt;br /&gt;
Hence testing if the pagination gem will work is equivalent to checking if rails is working. &lt;br /&gt;
&lt;br /&gt;
As testing rails is not recommended  no automated test is added  for  changes made.&lt;/div&gt;</summary>
		<author><name>Krkulkar</name></author>
	</entry>
	<entry>
		<id>https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=113833</id>
		<title>CSC/ECE 517 Fall 2017/E17A8. Use a profiler to identify the problems / pages that take some time to load &amp; fix them</title>
		<link rel="alternate" type="text/html" href="https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=113833"/>
		<updated>2017-11-29T22:43:48Z</updated>

		<summary type="html">&lt;p&gt;Krkulkar: /* Pages which needs to be optimized */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;= Optimization for page loading in Expertiza =&lt;br /&gt;
&lt;br /&gt;
== Introduction ==&lt;br /&gt;
Expertiza is an online system that is used by students to view/submit assignments and review others' work. Expertiza also provides tools to visualize the scores and gauge the improvements made during the course semester. It also facilitates and monitors team projects. It is targeted at educational and non-profit organizations. The project is funded by the National Software Foundation (NSF), NCSU Learning in a Technology-Rich Environment (LITRE) program, the NCSU Faculty Center for Teaching and Learning, the NCSU STEM Initiative, and the Center for Advanced Computing and Communication.&lt;br /&gt;
&lt;br /&gt;
Expertiza is an open-source project with the source code available as a public repository on GitHub. It is developed using Ruby on Rails and is increasingly becoming robust thanks to the innumerable bugs being fixed by the community. The project has a micro-blog on SourceForge where the developer community report bugs and document updates.&lt;br /&gt;
&lt;br /&gt;
== Project Description ==&lt;br /&gt;
&lt;br /&gt;
1) Identifying the Expertiza pages which take time to load using Rack-mini-profiler and Flamegraphs.&lt;br /&gt;
&lt;br /&gt;
2) Propose fixes which would improve the Expertiza project.&lt;br /&gt;
&lt;br /&gt;
3) Optimizing the view, models and controllers for few of these corresponding fixes to improve the load time of these pages.&lt;br /&gt;
&lt;br /&gt;
== Gems Installed  ==&lt;br /&gt;
&lt;br /&gt;
*rack-mini-profiler :- Middleware that displays speed badge for every html page. Designed to work both in production and in development&lt;br /&gt;
*flamegraphs :- Flame graphs are a visualization of profiled software, allowing the most frequent code-paths to be identified quickly and accurately.&lt;br /&gt;
*stackprof:-A sampling call-stack profiler for ruby 2.1+.Downloaded as a dependency for rack-mini-profiler.&lt;br /&gt;
*fast_stack :-fast_stack is dynamically resizable data structure optimized for fast iteration over the large arrays of similar elements avoiding memory fragmentation.&lt;br /&gt;
*Kaminari:- A Scope &amp;amp; Engine based, clean, powerful, customizable and sophisticated paginator for modern web app frameworks and ORMs&lt;br /&gt;
&lt;br /&gt;
== Pages which needs to be optimized ==&lt;br /&gt;
&lt;br /&gt;
1) expertiza.ncsu.edu/grades/view?id=&amp;lt;ID of the team&amp;gt;&lt;br /&gt;
&lt;br /&gt;
2) expertiza.ncsu.edu/users/list&lt;br /&gt;
&lt;br /&gt;
== Project Design ==&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
For the purpose of this project, experts in the expertiza domain are Instructors. &lt;br /&gt;
&lt;br /&gt;
The following two patterns are implemented in the project - &lt;br /&gt;
&lt;br /&gt;
1.MVC Pattern - The project is implemented in Ruby on Rails that uses MVC architecture. It separates an application’s data model, user interface, and control logic into three distinct components (model, view, and controller, respectively). &lt;br /&gt;
&lt;br /&gt;
2.DRY Principle - We are trying to reuse the existing functionalities in Expertiza, thus avoiding code duplication. Whenever possible, code modification based on the existing classes, controllers, or tables will be done instead of creating the new one.&lt;br /&gt;
&lt;br /&gt;
3.Optimization - In order to optimize, we need to understand the factors which are causing the lag. This can be identified by using the flamegraph generation method and rack-mini-profiler statistics.&lt;br /&gt;
&lt;br /&gt;
==Approach==&lt;br /&gt;
To complete the given task, we identified the factors which are causing the lag. This was done by using flamegraph generation and rack-mini-profiler statistics. The statistics generated by rack miniprofiler helped us to understand the time taken by each component to get loaded. From these statistics, we identified the model/controller/view/database query which is causing this latency. From here, we identified the methods which needed to be implemented in order to optimize the webpage rendering.&lt;br /&gt;
&lt;br /&gt;
Optimization approach for the pages:&lt;br /&gt;
*users/list :- Pagination was used to optimze. This was done using the Kaminari gem for Rails.&lt;br /&gt;
*grades/view : Ajax must be used for the optimization. Currently, all the data for all the teams present is loaded when the webpage is accessed. Instead, data for particular teams can be loaded when the user clicks on the expand button for that particular team. Thus, data for each team should be loaded asynchronously with ajax.&lt;br /&gt;
&lt;br /&gt;
==Identification of pages ==&lt;br /&gt;
===Analysis of page 1: expertiza.ncsu.edu/tree_display/list ===&lt;br /&gt;
&lt;br /&gt;
===FlameGraph Statistics===&lt;br /&gt;
The following is the flamegraph for this page:-&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:f.png]]&lt;br /&gt;
&lt;br /&gt;
The X axis of the FlameGraph represents the time taken to load the page. It can give a clear picture of where the expertiza page is getting bogged down. The widest layers take the longest to run. They’re the areas one should look into, because speeding them up could have the biggest impact. As we can see over here, most of the time taken over here is in the controller action.&lt;br /&gt;
&lt;br /&gt;
===MiniProfiler Statistics===&lt;br /&gt;
&lt;br /&gt;
The following is the rack-mini-profiler statistics for the page:-&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tre1.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
The box which is seen in the leftmost corner is the MiniProfiler statistics. MiniProfiler gives  a constant notification of how long each page takes to load. The miniprofiler statistics show the time taken to render the view as well as the corresponding SQL calls.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree2.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
This image shows the time and the number of SQL calls which are required for each rendering.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree5.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
Here as we can see the total number of SQL calls required for children_node_ng is 1123. This is causing the latency in the entire page by 10564.8 ms. These statistics helped us to identify the method which needs to be refactored.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree6.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
The total number of SQL calls required for 2 components here is 2 each. Hence we do not need to refactor this component.&lt;br /&gt;
&lt;br /&gt;
===Identified Component causing the delay===&lt;br /&gt;
tree_display_controller&lt;br /&gt;
&lt;br /&gt;
The following methods are consuming most of the time in this code :-&lt;br /&gt;
&lt;br /&gt;
1)update_fnode_children&lt;br /&gt;
&lt;br /&gt;
2)initialize_fnode_update_children&lt;br /&gt;
&lt;br /&gt;
3)children_node_ng&lt;br /&gt;
&lt;br /&gt;
These methods are from line 172-201 in this controller.&lt;br /&gt;
&lt;br /&gt;
==  Solution ==&lt;br /&gt;
*users/list&lt;br /&gt;
The time taken to load the page was high because the server had to access through hundreds of rows in the database .The page was rendering the entire row of database at the same time. Pagination helped to split the database  into manageable chunks of data.&lt;br /&gt;
&lt;br /&gt;
*grades/view&lt;br /&gt;
The grades/view is the page where  the instructor accesses the grades statistics of each student.&lt;br /&gt;
The reason for  the slow down in the page is that the data for all the teams were loaded as soon as the page was loaded.The design of the page has an individual tab for each team, hence loading the entire data as soon as the page is loaded is quite redundant as the instructor needs to access the scores of each individual team at a given time.&lt;br /&gt;
The solution to this problem is to access the individual team statistics from the database when the instructor clicks the tab specified for the particular individual. &lt;br /&gt;
&lt;br /&gt;
Issues faced during implementation of this solution:- &lt;br /&gt;
1)&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
2)&lt;br /&gt;
&lt;br /&gt;
==Test Plan==&lt;br /&gt;
The project is based on optimizing the time required to load the pages which has been mentioned above,in order to test that there is an improvement in the time taken to load these pages one will have to compare the initial loading time and the time taken after the code has been modified.&lt;br /&gt;
&lt;br /&gt;
===Initial Setup for testing===&lt;br /&gt;
&lt;br /&gt;
1)Clone the git repository.&lt;br /&gt;
&lt;br /&gt;
2)Go to the commit on 3rd November(name: initial setup),this is the code which is originally provided by the professor and has not been modified. It however consists of the two gems required to check the loading time.&lt;br /&gt;
&lt;br /&gt;
3)To login as instructor :-&lt;br /&gt;
USERNAME :- instructor6&lt;br /&gt;
Password:-password&lt;br /&gt;
&lt;br /&gt;
===Testing===&lt;br /&gt;
&lt;br /&gt;
1)Check the time taken to load the page localhost:3000/tree_display/list on the left corner and compare the same for the latest pull,a substantial difference in the loading time.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
2)Check the time taken to load the page localhost:3000/review_mapping/response_report on the left corner and compare the same for the latest pull,a substantial difference in the loading time.&lt;br /&gt;
&lt;br /&gt;
===Automated Test===&lt;br /&gt;
&lt;br /&gt;
There can be no automated test for this program since the improvement in the performance is due to the inclusion of the pagination gem. &lt;br /&gt;
&lt;br /&gt;
Hence testing if the pagination gem will work is equivalent to checking if rails is working. &lt;br /&gt;
&lt;br /&gt;
As testing rails is not recommended  no automated test is added  for  changes made.&lt;/div&gt;</summary>
		<author><name>Krkulkar</name></author>
	</entry>
	<entry>
		<id>https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=113832</id>
		<title>CSC/ECE 517 Fall 2017/E17A8. Use a profiler to identify the problems / pages that take some time to load &amp; fix them</title>
		<link rel="alternate" type="text/html" href="https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=113832"/>
		<updated>2017-11-29T22:43:00Z</updated>

		<summary type="html">&lt;p&gt;Krkulkar: /* PROJECT DESIGN */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;= Optimization for page loading in Expertiza =&lt;br /&gt;
&lt;br /&gt;
== Introduction ==&lt;br /&gt;
Expertiza is an online system that is used by students to view/submit assignments and review others' work. Expertiza also provides tools to visualize the scores and gauge the improvements made during the course semester. It also facilitates and monitors team projects. It is targeted at educational and non-profit organizations. The project is funded by the National Software Foundation (NSF), NCSU Learning in a Technology-Rich Environment (LITRE) program, the NCSU Faculty Center for Teaching and Learning, the NCSU STEM Initiative, and the Center for Advanced Computing and Communication.&lt;br /&gt;
&lt;br /&gt;
Expertiza is an open-source project with the source code available as a public repository on GitHub. It is developed using Ruby on Rails and is increasingly becoming robust thanks to the innumerable bugs being fixed by the community. The project has a micro-blog on SourceForge where the developer community report bugs and document updates.&lt;br /&gt;
&lt;br /&gt;
== Project Description ==&lt;br /&gt;
&lt;br /&gt;
1) Identifying the Expertiza pages which take time to load using Rack-mini-profiler and Flamegraphs.&lt;br /&gt;
&lt;br /&gt;
2) Propose fixes which would improve the Expertiza project.&lt;br /&gt;
&lt;br /&gt;
3) Optimizing the view, models and controllers for few of these corresponding fixes to improve the load time of these pages.&lt;br /&gt;
&lt;br /&gt;
== Gems Installed  ==&lt;br /&gt;
&lt;br /&gt;
*rack-mini-profiler :- Middleware that displays speed badge for every html page. Designed to work both in production and in development&lt;br /&gt;
*flamegraphs :- Flame graphs are a visualization of profiled software, allowing the most frequent code-paths to be identified quickly and accurately.&lt;br /&gt;
*stackprof:-A sampling call-stack profiler for ruby 2.1+.Downloaded as a dependency for rack-mini-profiler.&lt;br /&gt;
*fast_stack :-fast_stack is dynamically resizable data structure optimized for fast iteration over the large arrays of similar elements avoiding memory fragmentation.&lt;br /&gt;
*Kaminari:- A Scope &amp;amp; Engine based, clean, powerful, customizable and sophisticated paginator for modern web app frameworks and ORMs&lt;br /&gt;
&lt;br /&gt;
== Pages which needs to be optimized ==&lt;br /&gt;
&lt;br /&gt;
1) expertiza.ncsu.edu/grades/view&lt;br /&gt;
&lt;br /&gt;
2) expertiza.ncsu.edu/users/list&lt;br /&gt;
&lt;br /&gt;
== Project Design ==&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
For the purpose of this project, experts in the expertiza domain are Instructors. &lt;br /&gt;
&lt;br /&gt;
The following two patterns are implemented in the project - &lt;br /&gt;
&lt;br /&gt;
1.MVC Pattern - The project is implemented in Ruby on Rails that uses MVC architecture. It separates an application’s data model, user interface, and control logic into three distinct components (model, view, and controller, respectively). &lt;br /&gt;
&lt;br /&gt;
2.DRY Principle - We are trying to reuse the existing functionalities in Expertiza, thus avoiding code duplication. Whenever possible, code modification based on the existing classes, controllers, or tables will be done instead of creating the new one.&lt;br /&gt;
&lt;br /&gt;
3.Optimization - In order to optimize, we need to understand the factors which are causing the lag. This can be identified by using the flamegraph generation method and rack-mini-profiler statistics.&lt;br /&gt;
&lt;br /&gt;
==Approach==&lt;br /&gt;
To complete the given task, we identified the factors which are causing the lag. This was done by using flamegraph generation and rack-mini-profiler statistics. The statistics generated by rack miniprofiler helped us to understand the time taken by each component to get loaded. From these statistics, we identified the model/controller/view/database query which is causing this latency. From here, we identified the methods which needed to be implemented in order to optimize the webpage rendering.&lt;br /&gt;
&lt;br /&gt;
Optimization approach for the pages:&lt;br /&gt;
*users/list :- Pagination was used to optimze. This was done using the Kaminari gem for Rails.&lt;br /&gt;
*grades/view : Ajax must be used for the optimization. Currently, all the data for all the teams present is loaded when the webpage is accessed. Instead, data for particular teams can be loaded when the user clicks on the expand button for that particular team. Thus, data for each team should be loaded asynchronously with ajax.&lt;br /&gt;
&lt;br /&gt;
==Identification of pages ==&lt;br /&gt;
===Analysis of page 1: expertiza.ncsu.edu/tree_display/list ===&lt;br /&gt;
&lt;br /&gt;
===FlameGraph Statistics===&lt;br /&gt;
The following is the flamegraph for this page:-&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:f.png]]&lt;br /&gt;
&lt;br /&gt;
The X axis of the FlameGraph represents the time taken to load the page. It can give a clear picture of where the expertiza page is getting bogged down. The widest layers take the longest to run. They’re the areas one should look into, because speeding them up could have the biggest impact. As we can see over here, most of the time taken over here is in the controller action.&lt;br /&gt;
&lt;br /&gt;
===MiniProfiler Statistics===&lt;br /&gt;
&lt;br /&gt;
The following is the rack-mini-profiler statistics for the page:-&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tre1.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
The box which is seen in the leftmost corner is the MiniProfiler statistics. MiniProfiler gives  a constant notification of how long each page takes to load. The miniprofiler statistics show the time taken to render the view as well as the corresponding SQL calls.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree2.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
This image shows the time and the number of SQL calls which are required for each rendering.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree5.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
Here as we can see the total number of SQL calls required for children_node_ng is 1123. This is causing the latency in the entire page by 10564.8 ms. These statistics helped us to identify the method which needs to be refactored.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree6.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
The total number of SQL calls required for 2 components here is 2 each. Hence we do not need to refactor this component.&lt;br /&gt;
&lt;br /&gt;
===Identified Component causing the delay===&lt;br /&gt;
tree_display_controller&lt;br /&gt;
&lt;br /&gt;
The following methods are consuming most of the time in this code :-&lt;br /&gt;
&lt;br /&gt;
1)update_fnode_children&lt;br /&gt;
&lt;br /&gt;
2)initialize_fnode_update_children&lt;br /&gt;
&lt;br /&gt;
3)children_node_ng&lt;br /&gt;
&lt;br /&gt;
These methods are from line 172-201 in this controller.&lt;br /&gt;
&lt;br /&gt;
==  Solution ==&lt;br /&gt;
*users/list&lt;br /&gt;
The time taken to load the page was high because the server had to access through hundreds of rows in the database .The page was rendering the entire row of database at the same time. Pagination helped to split the database  into manageable chunks of data.&lt;br /&gt;
&lt;br /&gt;
*grades/view&lt;br /&gt;
The grades/view is the page where  the instructor accesses the grades statistics of each student.&lt;br /&gt;
The reason for  the slow down in the page is that the data for all the teams were loaded as soon as the page was loaded.The design of the page has an individual tab for each team, hence loading the entire data as soon as the page is loaded is quite redundant as the instructor needs to access the scores of each individual team at a given time.&lt;br /&gt;
The solution to this problem is to access the individual team statistics from the database when the instructor clicks the tab specified for the particular individual. &lt;br /&gt;
&lt;br /&gt;
Issues faced during implementation of this solution:- &lt;br /&gt;
1)&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
2)&lt;br /&gt;
&lt;br /&gt;
==Test Plan==&lt;br /&gt;
The project is based on optimizing the time required to load the pages which has been mentioned above,in order to test that there is an improvement in the time taken to load these pages one will have to compare the initial loading time and the time taken after the code has been modified.&lt;br /&gt;
&lt;br /&gt;
===Initial Setup for testing===&lt;br /&gt;
&lt;br /&gt;
1)Clone the git repository.&lt;br /&gt;
&lt;br /&gt;
2)Go to the commit on 3rd November(name: initial setup),this is the code which is originally provided by the professor and has not been modified. It however consists of the two gems required to check the loading time.&lt;br /&gt;
&lt;br /&gt;
3)To login as instructor :-&lt;br /&gt;
USERNAME :- instructor6&lt;br /&gt;
Password:-password&lt;br /&gt;
&lt;br /&gt;
===Testing===&lt;br /&gt;
&lt;br /&gt;
1)Check the time taken to load the page localhost:3000/tree_display/list on the left corner and compare the same for the latest pull,a substantial difference in the loading time.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
2)Check the time taken to load the page localhost:3000/review_mapping/response_report on the left corner and compare the same for the latest pull,a substantial difference in the loading time.&lt;br /&gt;
&lt;br /&gt;
===Automated Test===&lt;br /&gt;
&lt;br /&gt;
There can be no automated test for this program since the improvement in the performance is due to the inclusion of the pagination gem. &lt;br /&gt;
&lt;br /&gt;
Hence testing if the pagination gem will work is equivalent to checking if rails is working. &lt;br /&gt;
&lt;br /&gt;
As testing rails is not recommended  no automated test is added  for  changes made.&lt;/div&gt;</summary>
		<author><name>Krkulkar</name></author>
	</entry>
	<entry>
		<id>https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=113831</id>
		<title>CSC/ECE 517 Fall 2017/E17A8. Use a profiler to identify the problems / pages that take some time to load &amp; fix them</title>
		<link rel="alternate" type="text/html" href="https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=113831"/>
		<updated>2017-11-29T22:42:44Z</updated>

		<summary type="html">&lt;p&gt;Krkulkar: /* PROJECT DESIGN */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;= Optimization for page loading in Expertiza =&lt;br /&gt;
&lt;br /&gt;
== Introduction ==&lt;br /&gt;
Expertiza is an online system that is used by students to view/submit assignments and review others' work. Expertiza also provides tools to visualize the scores and gauge the improvements made during the course semester. It also facilitates and monitors team projects. It is targeted at educational and non-profit organizations. The project is funded by the National Software Foundation (NSF), NCSU Learning in a Technology-Rich Environment (LITRE) program, the NCSU Faculty Center for Teaching and Learning, the NCSU STEM Initiative, and the Center for Advanced Computing and Communication.&lt;br /&gt;
&lt;br /&gt;
Expertiza is an open-source project with the source code available as a public repository on GitHub. It is developed using Ruby on Rails and is increasingly becoming robust thanks to the innumerable bugs being fixed by the community. The project has a micro-blog on SourceForge where the developer community report bugs and document updates.&lt;br /&gt;
&lt;br /&gt;
== Project Description ==&lt;br /&gt;
&lt;br /&gt;
1) Identifying the Expertiza pages which take time to load using Rack-mini-profiler and Flamegraphs.&lt;br /&gt;
&lt;br /&gt;
2) Propose fixes which would improve the Expertiza project.&lt;br /&gt;
&lt;br /&gt;
3) Optimizing the view, models and controllers for few of these corresponding fixes to improve the load time of these pages.&lt;br /&gt;
&lt;br /&gt;
== Gems Installed  ==&lt;br /&gt;
&lt;br /&gt;
*rack-mini-profiler :- Middleware that displays speed badge for every html page. Designed to work both in production and in development&lt;br /&gt;
*flamegraphs :- Flame graphs are a visualization of profiled software, allowing the most frequent code-paths to be identified quickly and accurately.&lt;br /&gt;
*stackprof:-A sampling call-stack profiler for ruby 2.1+.Downloaded as a dependency for rack-mini-profiler.&lt;br /&gt;
*fast_stack :-fast_stack is dynamically resizable data structure optimized for fast iteration over the large arrays of similar elements avoiding memory fragmentation.&lt;br /&gt;
*Kaminari:- A Scope &amp;amp; Engine based, clean, powerful, customizable and sophisticated paginator for modern web app frameworks and ORMs&lt;br /&gt;
&lt;br /&gt;
== Pages which needs to be optimized ==&lt;br /&gt;
&lt;br /&gt;
1) expertiza.ncsu.edu/grades/view&lt;br /&gt;
&lt;br /&gt;
2) expertiza.ncsu.edu/users/list&lt;br /&gt;
&lt;br /&gt;
== PROJECT DESIGN ==&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
For the purpose of this project, experts in the expertiza domain are Instructors. &lt;br /&gt;
&lt;br /&gt;
The following two patterns are implemented in the project - &lt;br /&gt;
&lt;br /&gt;
1.MVC Pattern - The project is implemented in Ruby on Rails that uses MVC architecture. It separates an application’s data model, user interface, and control logic into three distinct components (model, view, and controller, respectively). &lt;br /&gt;
&lt;br /&gt;
2.DRY Principle - We are trying to reuse the existing functionalities in Expertiza, thus avoiding code duplication. Whenever possible, code modification based on the existing classes, controllers, or tables will be done instead of creating the new one.&lt;br /&gt;
&lt;br /&gt;
3.Optimization - In order to optimize, we need to understand the factors which are causing the lag. This can be identified by using the flamegraph generation method and rack-mini-profiler statistics.&lt;br /&gt;
&lt;br /&gt;
==Approach==&lt;br /&gt;
To complete the given task, we identified the factors which are causing the lag. This was done by using flamegraph generation and rack-mini-profiler statistics. The statistics generated by rack miniprofiler helped us to understand the time taken by each component to get loaded. From these statistics, we identified the model/controller/view/database query which is causing this latency. From here, we identified the methods which needed to be implemented in order to optimize the webpage rendering.&lt;br /&gt;
&lt;br /&gt;
Optimization approach for the pages:&lt;br /&gt;
*users/list :- Pagination was used to optimze. This was done using the Kaminari gem for Rails.&lt;br /&gt;
*grades/view : Ajax must be used for the optimization. Currently, all the data for all the teams present is loaded when the webpage is accessed. Instead, data for particular teams can be loaded when the user clicks on the expand button for that particular team. Thus, data for each team should be loaded asynchronously with ajax.&lt;br /&gt;
&lt;br /&gt;
==Identification of pages ==&lt;br /&gt;
===Analysis of page 1: expertiza.ncsu.edu/tree_display/list ===&lt;br /&gt;
&lt;br /&gt;
===FlameGraph Statistics===&lt;br /&gt;
The following is the flamegraph for this page:-&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:f.png]]&lt;br /&gt;
&lt;br /&gt;
The X axis of the FlameGraph represents the time taken to load the page. It can give a clear picture of where the expertiza page is getting bogged down. The widest layers take the longest to run. They’re the areas one should look into, because speeding them up could have the biggest impact. As we can see over here, most of the time taken over here is in the controller action.&lt;br /&gt;
&lt;br /&gt;
===MiniProfiler Statistics===&lt;br /&gt;
&lt;br /&gt;
The following is the rack-mini-profiler statistics for the page:-&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tre1.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
The box which is seen in the leftmost corner is the MiniProfiler statistics. MiniProfiler gives  a constant notification of how long each page takes to load. The miniprofiler statistics show the time taken to render the view as well as the corresponding SQL calls.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree2.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
This image shows the time and the number of SQL calls which are required for each rendering.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree5.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
Here as we can see the total number of SQL calls required for children_node_ng is 1123. This is causing the latency in the entire page by 10564.8 ms. These statistics helped us to identify the method which needs to be refactored.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree6.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
The total number of SQL calls required for 2 components here is 2 each. Hence we do not need to refactor this component.&lt;br /&gt;
&lt;br /&gt;
===Identified Component causing the delay===&lt;br /&gt;
tree_display_controller&lt;br /&gt;
&lt;br /&gt;
The following methods are consuming most of the time in this code :-&lt;br /&gt;
&lt;br /&gt;
1)update_fnode_children&lt;br /&gt;
&lt;br /&gt;
2)initialize_fnode_update_children&lt;br /&gt;
&lt;br /&gt;
3)children_node_ng&lt;br /&gt;
&lt;br /&gt;
These methods are from line 172-201 in this controller.&lt;br /&gt;
&lt;br /&gt;
==  Solution ==&lt;br /&gt;
*users/list&lt;br /&gt;
The time taken to load the page was high because the server had to access through hundreds of rows in the database .The page was rendering the entire row of database at the same time. Pagination helped to split the database  into manageable chunks of data.&lt;br /&gt;
&lt;br /&gt;
*grades/view&lt;br /&gt;
The grades/view is the page where  the instructor accesses the grades statistics of each student.&lt;br /&gt;
The reason for  the slow down in the page is that the data for all the teams were loaded as soon as the page was loaded.The design of the page has an individual tab for each team, hence loading the entire data as soon as the page is loaded is quite redundant as the instructor needs to access the scores of each individual team at a given time.&lt;br /&gt;
The solution to this problem is to access the individual team statistics from the database when the instructor clicks the tab specified for the particular individual. &lt;br /&gt;
&lt;br /&gt;
Issues faced during implementation of this solution:- &lt;br /&gt;
1)&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
2)&lt;br /&gt;
&lt;br /&gt;
==Test Plan==&lt;br /&gt;
The project is based on optimizing the time required to load the pages which has been mentioned above,in order to test that there is an improvement in the time taken to load these pages one will have to compare the initial loading time and the time taken after the code has been modified.&lt;br /&gt;
&lt;br /&gt;
===Initial Setup for testing===&lt;br /&gt;
&lt;br /&gt;
1)Clone the git repository.&lt;br /&gt;
&lt;br /&gt;
2)Go to the commit on 3rd November(name: initial setup),this is the code which is originally provided by the professor and has not been modified. It however consists of the two gems required to check the loading time.&lt;br /&gt;
&lt;br /&gt;
3)To login as instructor :-&lt;br /&gt;
USERNAME :- instructor6&lt;br /&gt;
Password:-password&lt;br /&gt;
&lt;br /&gt;
===Testing===&lt;br /&gt;
&lt;br /&gt;
1)Check the time taken to load the page localhost:3000/tree_display/list on the left corner and compare the same for the latest pull,a substantial difference in the loading time.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
2)Check the time taken to load the page localhost:3000/review_mapping/response_report on the left corner and compare the same for the latest pull,a substantial difference in the loading time.&lt;br /&gt;
&lt;br /&gt;
===Automated Test===&lt;br /&gt;
&lt;br /&gt;
There can be no automated test for this program since the improvement in the performance is due to the inclusion of the pagination gem. &lt;br /&gt;
&lt;br /&gt;
Hence testing if the pagination gem will work is equivalent to checking if rails is working. &lt;br /&gt;
&lt;br /&gt;
As testing rails is not recommended  no automated test is added  for  changes made.&lt;/div&gt;</summary>
		<author><name>Krkulkar</name></author>
	</entry>
	<entry>
		<id>https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=113830</id>
		<title>CSC/ECE 517 Fall 2017/E17A8. Use a profiler to identify the problems / pages that take some time to load &amp; fix them</title>
		<link rel="alternate" type="text/html" href="https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=113830"/>
		<updated>2017-11-29T22:41:46Z</updated>

		<summary type="html">&lt;p&gt;Krkulkar: /* Approach */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;= Optimization for page loading in Expertiza =&lt;br /&gt;
&lt;br /&gt;
== Introduction ==&lt;br /&gt;
Expertiza is an online system that is used by students to view/submit assignments and review others' work. Expertiza also provides tools to visualize the scores and gauge the improvements made during the course semester. It also facilitates and monitors team projects. It is targeted at educational and non-profit organizations. The project is funded by the National Software Foundation (NSF), NCSU Learning in a Technology-Rich Environment (LITRE) program, the NCSU Faculty Center for Teaching and Learning, the NCSU STEM Initiative, and the Center for Advanced Computing and Communication.&lt;br /&gt;
&lt;br /&gt;
Expertiza is an open-source project with the source code available as a public repository on GitHub. It is developed using Ruby on Rails and is increasingly becoming robust thanks to the innumerable bugs being fixed by the community. The project has a micro-blog on SourceForge where the developer community report bugs and document updates.&lt;br /&gt;
&lt;br /&gt;
== Project Description ==&lt;br /&gt;
&lt;br /&gt;
1) Identifying the Expertiza pages which take time to load using Rack-mini-profiler and Flamegraphs.&lt;br /&gt;
&lt;br /&gt;
2) Propose fixes which would improve the Expertiza project.&lt;br /&gt;
&lt;br /&gt;
3) Optimizing the view, models and controllers for few of these corresponding fixes to improve the load time of these pages.&lt;br /&gt;
&lt;br /&gt;
== Gems Installed  ==&lt;br /&gt;
&lt;br /&gt;
*rack-mini-profiler :- Middleware that displays speed badge for every html page. Designed to work both in production and in development&lt;br /&gt;
*flamegraphs :- Flame graphs are a visualization of profiled software, allowing the most frequent code-paths to be identified quickly and accurately.&lt;br /&gt;
*stackprof:-A sampling call-stack profiler for ruby 2.1+.Downloaded as a dependency for rack-mini-profiler.&lt;br /&gt;
*fast_stack :-fast_stack is dynamically resizable data structure optimized for fast iteration over the large arrays of similar elements avoiding memory fragmentation.&lt;br /&gt;
*Kaminari:- A Scope &amp;amp; Engine based, clean, powerful, customizable and sophisticated paginator for modern web app frameworks and ORMs&lt;br /&gt;
&lt;br /&gt;
== Pages which needs to be optimized ==&lt;br /&gt;
&lt;br /&gt;
1) expertiza.ncsu.edu/grades/view&lt;br /&gt;
&lt;br /&gt;
2) expertiza.ncsu.edu/users/list&lt;br /&gt;
&lt;br /&gt;
== PROJECT DESIGN ==&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
For the purpose of this project, experts in the expertiza domain are Instructors. &lt;br /&gt;
&lt;br /&gt;
The following two patterns are implemented in the project - &lt;br /&gt;
&lt;br /&gt;
1.MVC Pattern – The project is implemented in Ruby on Rails that uses MVC architecture. It separates an application’s data model, user interface, and control logic into three distinct components (model, view, and controller, respectively). &lt;br /&gt;
&lt;br /&gt;
2.DRY Principle – We are trying to reuse the existing functionalities in Expertiza, thus avoiding code duplication. Whenever possible, code modification based on the existing classes, controllers, or tables will be done instead of creating the new one.&lt;br /&gt;
&lt;br /&gt;
3.Optimization-In order to optimize, we need to understand the factors which are causing the lag. This can be identified by using the flamegraph generation method and rack-mini-profiler statistics.&lt;br /&gt;
&lt;br /&gt;
==Approach==&lt;br /&gt;
To complete the given task, we identified the factors which are causing the lag. This was done by using flamegraph generation and rack-mini-profiler statistics. The statistics generated by rack miniprofiler helped us to understand the time taken by each component to get loaded. From these statistics, we identified the model/controller/view/database query which is causing this latency. From here, we identified the methods which needed to be implemented in order to optimize the webpage rendering.&lt;br /&gt;
&lt;br /&gt;
Optimization approach for the pages:&lt;br /&gt;
*users/list :- Pagination was used to optimze. This was done using the Kaminari gem for Rails.&lt;br /&gt;
*grades/view : Ajax must be used for the optimization. Currently, all the data for all the teams present is loaded when the webpage is accessed. Instead, data for particular teams can be loaded when the user clicks on the expand button for that particular team. Thus, data for each team should be loaded asynchronously with ajax.&lt;br /&gt;
&lt;br /&gt;
==Identification of pages ==&lt;br /&gt;
===Analysis of page 1: expertiza.ncsu.edu/tree_display/list ===&lt;br /&gt;
&lt;br /&gt;
===FlameGraph Statistics===&lt;br /&gt;
The following is the flamegraph for this page:-&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:f.png]]&lt;br /&gt;
&lt;br /&gt;
The X axis of the FlameGraph represents the time taken to load the page. It can give a clear picture of where the expertiza page is getting bogged down. The widest layers take the longest to run. They’re the areas one should look into, because speeding them up could have the biggest impact. As we can see over here, most of the time taken over here is in the controller action.&lt;br /&gt;
&lt;br /&gt;
===MiniProfiler Statistics===&lt;br /&gt;
&lt;br /&gt;
The following is the rack-mini-profiler statistics for the page:-&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tre1.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
The box which is seen in the leftmost corner is the MiniProfiler statistics. MiniProfiler gives  a constant notification of how long each page takes to load. The miniprofiler statistics show the time taken to render the view as well as the corresponding SQL calls.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree2.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
This image shows the time and the number of SQL calls which are required for each rendering.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree5.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
Here as we can see the total number of SQL calls required for children_node_ng is 1123. This is causing the latency in the entire page by 10564.8 ms. These statistics helped us to identify the method which needs to be refactored.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree6.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
The total number of SQL calls required for 2 components here is 2 each. Hence we do not need to refactor this component.&lt;br /&gt;
&lt;br /&gt;
===Identified Component causing the delay===&lt;br /&gt;
tree_display_controller&lt;br /&gt;
&lt;br /&gt;
The following methods are consuming most of the time in this code :-&lt;br /&gt;
&lt;br /&gt;
1)update_fnode_children&lt;br /&gt;
&lt;br /&gt;
2)initialize_fnode_update_children&lt;br /&gt;
&lt;br /&gt;
3)children_node_ng&lt;br /&gt;
&lt;br /&gt;
These methods are from line 172-201 in this controller.&lt;br /&gt;
&lt;br /&gt;
==  Solution ==&lt;br /&gt;
*users/list&lt;br /&gt;
The time taken to load the page was high because the server had to access through hundreds of rows in the database .The page was rendering the entire row of database at the same time. Pagination helped to split the database  into manageable chunks of data.&lt;br /&gt;
&lt;br /&gt;
*grades/view&lt;br /&gt;
The grades/view is the page where  the instructor accesses the grades statistics of each student.&lt;br /&gt;
The reason for  the slow down in the page is that the data for all the teams were loaded as soon as the page was loaded.The design of the page has an individual tab for each team, hence loading the entire data as soon as the page is loaded is quite redundant as the instructor needs to access the scores of each individual team at a given time.&lt;br /&gt;
The solution to this problem is to access the individual team statistics from the database when the instructor clicks the tab specified for the particular individual. &lt;br /&gt;
&lt;br /&gt;
Issues faced during implementation of this solution:- &lt;br /&gt;
1)&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
2)&lt;br /&gt;
&lt;br /&gt;
==Test Plan==&lt;br /&gt;
The project is based on optimizing the time required to load the pages which has been mentioned above,in order to test that there is an improvement in the time taken to load these pages one will have to compare the initial loading time and the time taken after the code has been modified.&lt;br /&gt;
&lt;br /&gt;
===Initial Setup for testing===&lt;br /&gt;
&lt;br /&gt;
1)Clone the git repository.&lt;br /&gt;
&lt;br /&gt;
2)Go to the commit on 3rd November(name: initial setup),this is the code which is originally provided by the professor and has not been modified. It however consists of the two gems required to check the loading time.&lt;br /&gt;
&lt;br /&gt;
3)To login as instructor :-&lt;br /&gt;
USERNAME :- instructor6&lt;br /&gt;
Password:-password&lt;br /&gt;
&lt;br /&gt;
===Testing===&lt;br /&gt;
&lt;br /&gt;
1)Check the time taken to load the page localhost:3000/tree_display/list on the left corner and compare the same for the latest pull,a substantial difference in the loading time.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
2)Check the time taken to load the page localhost:3000/review_mapping/response_report on the left corner and compare the same for the latest pull,a substantial difference in the loading time.&lt;br /&gt;
&lt;br /&gt;
===Automated Test===&lt;br /&gt;
&lt;br /&gt;
There can be no automated test for this program since the improvement in the performance is due to the inclusion of the pagination gem. &lt;br /&gt;
&lt;br /&gt;
Hence testing if the pagination gem will work is equivalent to checking if rails is working. &lt;br /&gt;
&lt;br /&gt;
As testing rails is not recommended  no automated test is added  for  changes made.&lt;/div&gt;</summary>
		<author><name>Krkulkar</name></author>
	</entry>
	<entry>
		<id>https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=113721</id>
		<title>CSC/ECE 517 Fall 2017/E17A8. Use a profiler to identify the problems / pages that take some time to load &amp; fix them</title>
		<link rel="alternate" type="text/html" href="https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=113721"/>
		<updated>2017-11-27T01:47:47Z</updated>

		<summary type="html">&lt;p&gt;Krkulkar: /* Approach */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;= Optimization for page loading in Expertiza =&lt;br /&gt;
&lt;br /&gt;
== Introduction ==&lt;br /&gt;
Expertiza is an online system that is used by students to view/submit assignments and review others' work. Expertiza also provides tools to visualize the scores and gauge the improvements made during the course semester. It also facilitates and monitors team projects. It is targeted at educational and non-profit organizations. The project is funded by the National Software Foundation (NSF), NCSU Learning in a Technology-Rich Environment (LITRE) program, the NCSU Faculty Center for Teaching and Learning, the NCSU STEM Initiative, and the Center for Advanced Computing and Communication.&lt;br /&gt;
&lt;br /&gt;
Expertiza is an open-source project with the source code available as a public repository on GitHub. It is developed using Ruby on Rails and is increasingly becoming robust thanks to the innumerable bugs being fixed by the community. The project has a micro-blog on SourceForge where the developer community report bugs and document updates.&lt;br /&gt;
&lt;br /&gt;
== Project Description ==&lt;br /&gt;
&lt;br /&gt;
1) Identifying the Expertiza pages which take time to load using Rack-mini-profiler and Flamegraphs.&lt;br /&gt;
&lt;br /&gt;
2) Propose fixes which would improve the Expertiza project.&lt;br /&gt;
&lt;br /&gt;
3) Optimizing the view, models and controllers for few of these corresponding fixes to improve the load time of these pages.&lt;br /&gt;
&lt;br /&gt;
== Gems Installed  ==&lt;br /&gt;
&lt;br /&gt;
*rack-mini-profiler :- Middleware that displays speed badge for every html page. Designed to work both in production and in development&lt;br /&gt;
*flamegraphs :- Flame graphs are a visualization of profiled software, allowing the most frequent code-paths to be identified quickly and accurately.&lt;br /&gt;
*stackprof:-A sampling call-stack profiler for ruby 2.1+.Downloaded as a dependency for rack-mini-profiler.&lt;br /&gt;
*fast_stack :-fast_stack is dynamically resizable data structure optimized for fast iteration over the large arrays of similar elements avoiding memory fragmentation.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
== Pages which needs to be optimized ==&lt;br /&gt;
&lt;br /&gt;
1) expertiza.ncsu.edu/grades/view&lt;br /&gt;
&lt;br /&gt;
2) expertiza.ncsu.edu/users/list&lt;br /&gt;
&lt;br /&gt;
== PROJECT DESIGN ==&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
For the purpose of this project, experts in the expertiza domain are Instructors. &lt;br /&gt;
The following two patterns are implemented in the project - &lt;br /&gt;
1.MVC Pattern – The project is implemented in Ruby on Rails that uses MVC architecture. It separates an application’s data model, user interface, and control logic into three distinct components (model, view, and controller, respectively). &lt;br /&gt;
2.DRY Principle – We are trying to reuse the existing functionalities in Expertiza, thus avoiding code duplication. Whenever possible, code modification based on the existing classes, controllers, or tables will be done instead of creating the new one.&lt;br /&gt;
3.Optimization-In order to optimize, we need to understand the factors which are causing the lag. This can be identified by using the flamegraph generation method and rack-mini-profiler statistics.&lt;br /&gt;
&lt;br /&gt;
==Approach==&lt;br /&gt;
To complete the given task, we identified the factors which are causing the lag. This was done by using flamegraph generation and rack-mini-profiler statistics. The statistics generated by rack miniprofiler helped us to understand the time taken by each component to get loaded. From these statistics, we identified the model/controller/view/database query which is causing this latency. From here, we identified the methods which needed to be refactored in order to optimize the webpage rendering.&lt;br /&gt;
&lt;br /&gt;
To optimize the page users/list, we implemented pagination. This was done using the Kaminari gem for Rails.&lt;br /&gt;
&lt;br /&gt;
==Identification of pages ==&lt;br /&gt;
===Analysis of page 1: expertiza.ncsu.edu/tree_display/list ===&lt;br /&gt;
&lt;br /&gt;
===FlameGraph Statistics===&lt;br /&gt;
The following is the flamegraph for this page:-&lt;br /&gt;
[[File:f.png]]&lt;br /&gt;
&lt;br /&gt;
The X axis of the FlameGraph represents the time taken to load the page. It can give a clear picture of where the expertiza page is getting bogged down. The widest layers take the longest to run. They’re the areas one should look into, because speeding them up could have the biggest impact. As we can see over here, most of the time taken over here is in the controller action.&lt;br /&gt;
&lt;br /&gt;
===MiniProfiler Statistics===&lt;br /&gt;
&lt;br /&gt;
The following is the rack-mini-profiler statistics for the page:-&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tre1.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
The box which is seen in the leftmost corner is the MiniProfiler statistics. MiniProfiler gives  a constant notification of how long each page takes to load. The miniprofiler statistics show the time taken to render the view as well as the corresponding SQL calls.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree2.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
This image shows the time and the number of SQL calls which are required for each rendering.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree5.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
Here as we can see the total number of SQL calls required for children_node_ng is 1123. This is causing the latency in the entire page by 10564.8 ms. These statistics helped us to identify the method which needs to be refactored.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree6.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
The total number of SQL calls required for 2 components here is 2 each. Hence we do not need to refactor this component.&lt;br /&gt;
&lt;br /&gt;
===Identified Component causing the delay===&lt;br /&gt;
tree_display_controller&lt;br /&gt;
&lt;br /&gt;
The following methods are consuming most of the time in this code :-&lt;br /&gt;
&lt;br /&gt;
1)update_fnode_children&lt;br /&gt;
&lt;br /&gt;
2)initialize_fnode_update_children&lt;br /&gt;
&lt;br /&gt;
3)children_node_ng&lt;br /&gt;
&lt;br /&gt;
These methods are from line 172-201 in this controller.&lt;br /&gt;
&lt;br /&gt;
== Proposed Solution ==&lt;br /&gt;
The time taken to load the page is high due to the time taken for the action children_node_ng. The time taken to execute it is 10564.8 milliseconds. This is due to the 1123 SQL calls which are performed in the given action. This delay can be reduced by reducing the total number of SQL calls, which can be reduced by identifying the methods causing this delay as well as by refactoring the code. The solution is to refactor the code which has been attached below to improve the time taken to perform this action.&lt;br /&gt;
&lt;br /&gt;
  def update_fnode_children(fnode, tmp_res)&lt;br /&gt;
    # fnode is short for foldernode which is the parent node&lt;br /&gt;
    # ch_nodes are childrens&lt;br /&gt;
    # cnode = fnode.get_children(&amp;quot;created_at&amp;quot;, &amp;quot;desc&amp;quot;, 2, nil, nil)&lt;br /&gt;
    ch_nodes = fnode.get_children(nil, nil, session[:user].id, nil, nil)&lt;br /&gt;
    tmp_res[fnode.get_name] = ch_nodes&lt;br /&gt;
  end&lt;br /&gt;
&lt;br /&gt;
 &lt;br /&gt;
  # initialize parent node and update child nodes for it&lt;br /&gt;
  def initialize_fnode_update_children(params, node, tmp_res)&lt;br /&gt;
    fnode = (params[:reactParams][:nodeType]).constantize.new&lt;br /&gt;
    node.each do |a|&lt;br /&gt;
    fnode[a[0]] = a[1]&lt;br /&gt;
  end&lt;br /&gt;
    update_fnode_children(fnode, tmp_res)&lt;br /&gt;
    end&lt;br /&gt;
&lt;br /&gt;
  &lt;br /&gt;
  # for child nodes&lt;br /&gt;
  def children_node_ng&lt;br /&gt;
    child_nodes = child_nodes_from_params(params[:reactParams][:child_nodes])&lt;br /&gt;
    tmp_res = {}&lt;br /&gt;
    child_nodes.each do |node|&lt;br /&gt;
    initialize_fnode_update_children(params, node, tmp_res)&lt;br /&gt;
  end&lt;br /&gt;
    res = res_node_for_child(tmp_res)&lt;br /&gt;
    respond_to do |format|&lt;br /&gt;
    format.html { render json: res }&lt;br /&gt;
    end&lt;br /&gt;
    end&lt;br /&gt;
==Test Plan==&lt;br /&gt;
The project is based on optimizing the time required to load the pages which has been mentioned above,in order to test that there is an improvement in the time taken to load these pages one will have to compare the initial loading time and the time taken after the code has been modified.&lt;br /&gt;
&lt;br /&gt;
===Initial Setup for testing===&lt;br /&gt;
&lt;br /&gt;
1)Clone the git repository.&lt;br /&gt;
&lt;br /&gt;
2)Go to the commit on 3rd November(name: initial setup),this is the code which is originally provided by the professor and has not been modified. It however consists of the two gems required to check the loading time.&lt;br /&gt;
&lt;br /&gt;
3)To login as instructor :-&lt;br /&gt;
USERNAME :- instructor6&lt;br /&gt;
Password:-password&lt;br /&gt;
&lt;br /&gt;
===Testing===&lt;br /&gt;
&lt;br /&gt;
1)Check the time taken to load the page localhost:3000/tree_display/list on the left corner and compare the same for the latest pull,a substantial difference in the loading time.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
2)Check the time taken to load the page localhost:3000/review_mapping/response_report on the left corner and compare the same for the latest pull,a substantial difference in the loading time.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
3)Check the time taken to load the page localhost:3000/grades/view on the left corner and compare the same for the latest pull,a substantial difference in the loading time.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
4)Check the time taken to load the page localhost:3000/users/list on the left corner and compare the same for the latest pull,a substantial difference in the loading time.&lt;/div&gt;</summary>
		<author><name>Krkulkar</name></author>
	</entry>
	<entry>
		<id>https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=113718</id>
		<title>CSC/ECE 517 Fall 2017/E17A8. Use a profiler to identify the problems / pages that take some time to load &amp; fix them</title>
		<link rel="alternate" type="text/html" href="https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=113718"/>
		<updated>2017-11-27T01:43:07Z</updated>

		<summary type="html">&lt;p&gt;Krkulkar: /* Pages which needs to be optimized */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;= Optimization for page loading in Expertiza =&lt;br /&gt;
&lt;br /&gt;
== Introduction ==&lt;br /&gt;
Expertiza is an online system that is used by students to view/submit assignments and review others' work. Expertiza also provides tools to visualize the scores and gauge the improvements made during the course semester. It also facilitates and monitors team projects. It is targeted at educational and non-profit organizations. The project is funded by the National Software Foundation (NSF), NCSU Learning in a Technology-Rich Environment (LITRE) program, the NCSU Faculty Center for Teaching and Learning, the NCSU STEM Initiative, and the Center for Advanced Computing and Communication.&lt;br /&gt;
&lt;br /&gt;
Expertiza is an open-source project with the source code available as a public repository on GitHub. It is developed using Ruby on Rails and is increasingly becoming robust thanks to the innumerable bugs being fixed by the community. The project has a micro-blog on SourceForge where the developer community report bugs and document updates.&lt;br /&gt;
&lt;br /&gt;
== Project Description ==&lt;br /&gt;
&lt;br /&gt;
1) Identifying the Expertiza pages which take time to load using Rack-mini-profiler and Flamegraphs.&lt;br /&gt;
&lt;br /&gt;
2) Propose fixes which would improve the Expertiza project.&lt;br /&gt;
&lt;br /&gt;
3) Optimizing the view, models and controllers for few of these corresponding fixes to improve the load time of these pages.&lt;br /&gt;
&lt;br /&gt;
== Gems Installed  ==&lt;br /&gt;
&lt;br /&gt;
*rack-mini-profiler :- Middleware that displays speed badge for every html page. Designed to work both in production and in development&lt;br /&gt;
*flamegraphs :- Flame graphs are a visualization of profiled software, allowing the most frequent code-paths to be identified quickly and accurately.&lt;br /&gt;
*stackprof:-A sampling call-stack profiler for ruby 2.1+.Downloaded as a dependency for rack-mini-profiler.&lt;br /&gt;
*fast_stack :-fast_stack is dynamically resizable data structure optimized for fast iteration over the large arrays of similar elements avoiding memory fragmentation.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
== Pages which needs to be optimized ==&lt;br /&gt;
&lt;br /&gt;
1) expertiza.ncsu.edu/grades/view&lt;br /&gt;
&lt;br /&gt;
2) expertiza.ncsu.edu/users/list&lt;br /&gt;
&lt;br /&gt;
== PROJECT DESIGN ==&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
For the purpose of this project, experts in the expertiza domain are Instructors. &lt;br /&gt;
The following two patterns are implemented in the project - &lt;br /&gt;
1.MVC Pattern – The project is implemented in Ruby on Rails that uses MVC architecture. It separates an application’s data model, user interface, and control logic into three distinct components (model, view, and controller, respectively). &lt;br /&gt;
2.DRY Principle – We are trying to reuse the existing functionalities in Expertiza, thus avoiding code duplication. Whenever possible, code modification based on the existing classes, controllers, or tables will be done instead of creating the new one.&lt;br /&gt;
3.Optimization-In order to optimize, we need to understand the factors which are causing the lag. This can be identified by using the flamegraph generation method and rack-mini-profiler statistics.&lt;br /&gt;
&lt;br /&gt;
==Approach==&lt;br /&gt;
To complete the given task,we need to identify the elements which are causing this lag. This can be identified by using the flamegraph generation method and rack-mini-profiler statistics. The statistics generated by rack miniprofiler help us to understand the time taken by each component to get loaded. From these statistics, we can identify the model/controller/view/database query which is causing this latency. From here, we can identify the methods which need to be refactored in order to optimize the webpage rendering.&lt;br /&gt;
&lt;br /&gt;
==Identification of pages ==&lt;br /&gt;
===Analysis of page 1: expertiza.ncsu.edu/tree_display/list ===&lt;br /&gt;
&lt;br /&gt;
===FlameGraph Statistics===&lt;br /&gt;
The following is the flamegraph for this page:-&lt;br /&gt;
[[File:f.png]]&lt;br /&gt;
&lt;br /&gt;
The X axis of the FlameGraph represents the time taken to load the page. It can give a clear picture of where the expertiza page is getting bogged down. The widest layers take the longest to run. They’re the areas one should look into, because speeding them up could have the biggest impact. As we can see over here, most of the time taken over here is in the controller action.&lt;br /&gt;
&lt;br /&gt;
===MiniProfiler Statistics===&lt;br /&gt;
&lt;br /&gt;
The following is the rack-mini-profiler statistics for the page:-&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tre1.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
The box which is seen in the leftmost corner is the MiniProfiler statistics. MiniProfiler gives  a constant notification of how long each page takes to load. The miniprofiler statistics show the time taken to render the view as well as the corresponding SQL calls.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree2.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
This image shows the time and the number of SQL calls which are required for each rendering.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree5.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
Here as we can see the total number of SQL calls required for children_node_ng is 1123. This is causing the latency in the entire page by 10564.8 ms. These statistics helped us to identify the method which needs to be refactored.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree6.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
The total number of SQL calls required for 2 components here is 2 each. Hence we do not need to refactor this component.&lt;br /&gt;
&lt;br /&gt;
===Identified Component causing the delay===&lt;br /&gt;
tree_display_controller&lt;br /&gt;
&lt;br /&gt;
The following methods are consuming most of the time in this code :-&lt;br /&gt;
&lt;br /&gt;
1)update_fnode_children&lt;br /&gt;
&lt;br /&gt;
2)initialize_fnode_update_children&lt;br /&gt;
&lt;br /&gt;
3)children_node_ng&lt;br /&gt;
&lt;br /&gt;
These methods are from line 172-201 in this controller.&lt;br /&gt;
&lt;br /&gt;
== Proposed Solution ==&lt;br /&gt;
The time taken to load the page is high due to the time taken for the action children_node_ng. The time taken to execute it is 10564.8 milliseconds. This is due to the 1123 SQL calls which are performed in the given action. This delay can be reduced by reducing the total number of SQL calls, which can be reduced by identifying the methods causing this delay as well as by refactoring the code. The solution is to refactor the code which has been attached below to improve the time taken to perform this action.&lt;br /&gt;
&lt;br /&gt;
  def update_fnode_children(fnode, tmp_res)&lt;br /&gt;
    # fnode is short for foldernode which is the parent node&lt;br /&gt;
    # ch_nodes are childrens&lt;br /&gt;
    # cnode = fnode.get_children(&amp;quot;created_at&amp;quot;, &amp;quot;desc&amp;quot;, 2, nil, nil)&lt;br /&gt;
    ch_nodes = fnode.get_children(nil, nil, session[:user].id, nil, nil)&lt;br /&gt;
    tmp_res[fnode.get_name] = ch_nodes&lt;br /&gt;
  end&lt;br /&gt;
&lt;br /&gt;
 &lt;br /&gt;
  # initialize parent node and update child nodes for it&lt;br /&gt;
  def initialize_fnode_update_children(params, node, tmp_res)&lt;br /&gt;
    fnode = (params[:reactParams][:nodeType]).constantize.new&lt;br /&gt;
    node.each do |a|&lt;br /&gt;
    fnode[a[0]] = a[1]&lt;br /&gt;
  end&lt;br /&gt;
    update_fnode_children(fnode, tmp_res)&lt;br /&gt;
    end&lt;br /&gt;
&lt;br /&gt;
  &lt;br /&gt;
  # for child nodes&lt;br /&gt;
  def children_node_ng&lt;br /&gt;
    child_nodes = child_nodes_from_params(params[:reactParams][:child_nodes])&lt;br /&gt;
    tmp_res = {}&lt;br /&gt;
    child_nodes.each do |node|&lt;br /&gt;
    initialize_fnode_update_children(params, node, tmp_res)&lt;br /&gt;
  end&lt;br /&gt;
    res = res_node_for_child(tmp_res)&lt;br /&gt;
    respond_to do |format|&lt;br /&gt;
    format.html { render json: res }&lt;br /&gt;
    end&lt;br /&gt;
    end&lt;br /&gt;
==Test Plan==&lt;br /&gt;
The project is based on optimizing the time required to load the pages which has been mentioned above,in order to test that there is an improvement in the time taken to load these pages one will have to compare the initial loading time and the time taken after the code has been modified.&lt;br /&gt;
&lt;br /&gt;
===Initial Setup for testing===&lt;br /&gt;
&lt;br /&gt;
1)Clone the git repository.&lt;br /&gt;
&lt;br /&gt;
2)Go to the commit on 3rd November(name: initial setup),this is the code which is originally provided by the professor and has not been modified. It however consists of the two gems required to check the loading time.&lt;br /&gt;
&lt;br /&gt;
3)To login as instructor :-&lt;br /&gt;
USERNAME :- instructor6&lt;br /&gt;
Password:-password&lt;br /&gt;
&lt;br /&gt;
===Testing===&lt;br /&gt;
&lt;br /&gt;
1)Check the time taken to load the page localhost:3000/tree_display/list on the left corner and compare the same for the latest pull,a substantial difference in the loading time.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
2)Check the time taken to load the page localhost:3000/review_mapping/response_report on the left corner and compare the same for the latest pull,a substantial difference in the loading time.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
3)Check the time taken to load the page localhost:3000/grades/view on the left corner and compare the same for the latest pull,a substantial difference in the loading time.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
4)Check the time taken to load the page localhost:3000/users/list on the left corner and compare the same for the latest pull,a substantial difference in the loading time.&lt;/div&gt;</summary>
		<author><name>Krkulkar</name></author>
	</entry>
	<entry>
		<id>https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=113717</id>
		<title>CSC/ECE 517 Fall 2017/E17A8. Use a profiler to identify the problems / pages that take some time to load &amp; fix them</title>
		<link rel="alternate" type="text/html" href="https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=113717"/>
		<updated>2017-11-27T01:42:54Z</updated>

		<summary type="html">&lt;p&gt;Krkulkar: /* Pages which needs to be optimized */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;= Optimization for page loading in Expertiza =&lt;br /&gt;
&lt;br /&gt;
== Introduction ==&lt;br /&gt;
Expertiza is an online system that is used by students to view/submit assignments and review others' work. Expertiza also provides tools to visualize the scores and gauge the improvements made during the course semester. It also facilitates and monitors team projects. It is targeted at educational and non-profit organizations. The project is funded by the National Software Foundation (NSF), NCSU Learning in a Technology-Rich Environment (LITRE) program, the NCSU Faculty Center for Teaching and Learning, the NCSU STEM Initiative, and the Center for Advanced Computing and Communication.&lt;br /&gt;
&lt;br /&gt;
Expertiza is an open-source project with the source code available as a public repository on GitHub. It is developed using Ruby on Rails and is increasingly becoming robust thanks to the innumerable bugs being fixed by the community. The project has a micro-blog on SourceForge where the developer community report bugs and document updates.&lt;br /&gt;
&lt;br /&gt;
== Project Description ==&lt;br /&gt;
&lt;br /&gt;
1) Identifying the Expertiza pages which take time to load using Rack-mini-profiler and Flamegraphs.&lt;br /&gt;
&lt;br /&gt;
2) Propose fixes which would improve the Expertiza project.&lt;br /&gt;
&lt;br /&gt;
3) Optimizing the view, models and controllers for few of these corresponding fixes to improve the load time of these pages.&lt;br /&gt;
&lt;br /&gt;
== Gems Installed  ==&lt;br /&gt;
&lt;br /&gt;
*rack-mini-profiler :- Middleware that displays speed badge for every html page. Designed to work both in production and in development&lt;br /&gt;
*flamegraphs :- Flame graphs are a visualization of profiled software, allowing the most frequent code-paths to be identified quickly and accurately.&lt;br /&gt;
*stackprof:-A sampling call-stack profiler for ruby 2.1+.Downloaded as a dependency for rack-mini-profiler.&lt;br /&gt;
*fast_stack :-fast_stack is dynamically resizable data structure optimized for fast iteration over the large arrays of similar elements avoiding memory fragmentation.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
== Pages which needs to be optimized ==&lt;br /&gt;
&lt;br /&gt;
1)expertiza.ncsu.edu/grades/view&lt;br /&gt;
&lt;br /&gt;
2)expertiza.ncsu.edu/users/list&lt;br /&gt;
&lt;br /&gt;
== PROJECT DESIGN ==&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
For the purpose of this project, experts in the expertiza domain are Instructors. &lt;br /&gt;
The following two patterns are implemented in the project - &lt;br /&gt;
1.MVC Pattern – The project is implemented in Ruby on Rails that uses MVC architecture. It separates an application’s data model, user interface, and control logic into three distinct components (model, view, and controller, respectively). &lt;br /&gt;
2.DRY Principle – We are trying to reuse the existing functionalities in Expertiza, thus avoiding code duplication. Whenever possible, code modification based on the existing classes, controllers, or tables will be done instead of creating the new one.&lt;br /&gt;
3.Optimization-In order to optimize, we need to understand the factors which are causing the lag. This can be identified by using the flamegraph generation method and rack-mini-profiler statistics.&lt;br /&gt;
&lt;br /&gt;
==Approach==&lt;br /&gt;
To complete the given task,we need to identify the elements which are causing this lag. This can be identified by using the flamegraph generation method and rack-mini-profiler statistics. The statistics generated by rack miniprofiler help us to understand the time taken by each component to get loaded. From these statistics, we can identify the model/controller/view/database query which is causing this latency. From here, we can identify the methods which need to be refactored in order to optimize the webpage rendering.&lt;br /&gt;
&lt;br /&gt;
==Identification of pages ==&lt;br /&gt;
===Analysis of page 1: expertiza.ncsu.edu/tree_display/list ===&lt;br /&gt;
&lt;br /&gt;
===FlameGraph Statistics===&lt;br /&gt;
The following is the flamegraph for this page:-&lt;br /&gt;
[[File:f.png]]&lt;br /&gt;
&lt;br /&gt;
The X axis of the FlameGraph represents the time taken to load the page. It can give a clear picture of where the expertiza page is getting bogged down. The widest layers take the longest to run. They’re the areas one should look into, because speeding them up could have the biggest impact. As we can see over here, most of the time taken over here is in the controller action.&lt;br /&gt;
&lt;br /&gt;
===MiniProfiler Statistics===&lt;br /&gt;
&lt;br /&gt;
The following is the rack-mini-profiler statistics for the page:-&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tre1.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
The box which is seen in the leftmost corner is the MiniProfiler statistics. MiniProfiler gives  a constant notification of how long each page takes to load. The miniprofiler statistics show the time taken to render the view as well as the corresponding SQL calls.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree2.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
This image shows the time and the number of SQL calls which are required for each rendering.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree5.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
Here as we can see the total number of SQL calls required for children_node_ng is 1123. This is causing the latency in the entire page by 10564.8 ms. These statistics helped us to identify the method which needs to be refactored.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree6.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
The total number of SQL calls required for 2 components here is 2 each. Hence we do not need to refactor this component.&lt;br /&gt;
&lt;br /&gt;
===Identified Component causing the delay===&lt;br /&gt;
tree_display_controller&lt;br /&gt;
&lt;br /&gt;
The following methods are consuming most of the time in this code :-&lt;br /&gt;
&lt;br /&gt;
1)update_fnode_children&lt;br /&gt;
&lt;br /&gt;
2)initialize_fnode_update_children&lt;br /&gt;
&lt;br /&gt;
3)children_node_ng&lt;br /&gt;
&lt;br /&gt;
These methods are from line 172-201 in this controller.&lt;br /&gt;
&lt;br /&gt;
== Proposed Solution ==&lt;br /&gt;
The time taken to load the page is high due to the time taken for the action children_node_ng. The time taken to execute it is 10564.8 milliseconds. This is due to the 1123 SQL calls which are performed in the given action. This delay can be reduced by reducing the total number of SQL calls, which can be reduced by identifying the methods causing this delay as well as by refactoring the code. The solution is to refactor the code which has been attached below to improve the time taken to perform this action.&lt;br /&gt;
&lt;br /&gt;
  def update_fnode_children(fnode, tmp_res)&lt;br /&gt;
    # fnode is short for foldernode which is the parent node&lt;br /&gt;
    # ch_nodes are childrens&lt;br /&gt;
    # cnode = fnode.get_children(&amp;quot;created_at&amp;quot;, &amp;quot;desc&amp;quot;, 2, nil, nil)&lt;br /&gt;
    ch_nodes = fnode.get_children(nil, nil, session[:user].id, nil, nil)&lt;br /&gt;
    tmp_res[fnode.get_name] = ch_nodes&lt;br /&gt;
  end&lt;br /&gt;
&lt;br /&gt;
 &lt;br /&gt;
  # initialize parent node and update child nodes for it&lt;br /&gt;
  def initialize_fnode_update_children(params, node, tmp_res)&lt;br /&gt;
    fnode = (params[:reactParams][:nodeType]).constantize.new&lt;br /&gt;
    node.each do |a|&lt;br /&gt;
    fnode[a[0]] = a[1]&lt;br /&gt;
  end&lt;br /&gt;
    update_fnode_children(fnode, tmp_res)&lt;br /&gt;
    end&lt;br /&gt;
&lt;br /&gt;
  &lt;br /&gt;
  # for child nodes&lt;br /&gt;
  def children_node_ng&lt;br /&gt;
    child_nodes = child_nodes_from_params(params[:reactParams][:child_nodes])&lt;br /&gt;
    tmp_res = {}&lt;br /&gt;
    child_nodes.each do |node|&lt;br /&gt;
    initialize_fnode_update_children(params, node, tmp_res)&lt;br /&gt;
  end&lt;br /&gt;
    res = res_node_for_child(tmp_res)&lt;br /&gt;
    respond_to do |format|&lt;br /&gt;
    format.html { render json: res }&lt;br /&gt;
    end&lt;br /&gt;
    end&lt;br /&gt;
==Test Plan==&lt;br /&gt;
The project is based on optimizing the time required to load the pages which has been mentioned above,in order to test that there is an improvement in the time taken to load these pages one will have to compare the initial loading time and the time taken after the code has been modified.&lt;br /&gt;
&lt;br /&gt;
===Initial Setup for testing===&lt;br /&gt;
&lt;br /&gt;
1)Clone the git repository.&lt;br /&gt;
&lt;br /&gt;
2)Go to the commit on 3rd November(name: initial setup),this is the code which is originally provided by the professor and has not been modified. It however consists of the two gems required to check the loading time.&lt;br /&gt;
&lt;br /&gt;
3)To login as instructor :-&lt;br /&gt;
USERNAME :- instructor6&lt;br /&gt;
Password:-password&lt;br /&gt;
&lt;br /&gt;
===Testing===&lt;br /&gt;
&lt;br /&gt;
1)Check the time taken to load the page localhost:3000/tree_display/list on the left corner and compare the same for the latest pull,a substantial difference in the loading time.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
2)Check the time taken to load the page localhost:3000/review_mapping/response_report on the left corner and compare the same for the latest pull,a substantial difference in the loading time.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
3)Check the time taken to load the page localhost:3000/grades/view on the left corner and compare the same for the latest pull,a substantial difference in the loading time.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
4)Check the time taken to load the page localhost:3000/users/list on the left corner and compare the same for the latest pull,a substantial difference in the loading time.&lt;/div&gt;</summary>
		<author><name>Krkulkar</name></author>
	</entry>
	<entry>
		<id>https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=112033</id>
		<title>CSC/ECE 517 Fall 2017/E17A8. Use a profiler to identify the problems / pages that take some time to load &amp; fix them</title>
		<link rel="alternate" type="text/html" href="https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=112033"/>
		<updated>2017-11-06T22:11:51Z</updated>

		<summary type="html">&lt;p&gt;Krkulkar: /* MiniProfiler Statistics */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;= Optimization for page loading in Expertiza =&lt;br /&gt;
&lt;br /&gt;
== Introduction ==&lt;br /&gt;
Expertiza is an online system that is used by students to view/submit assignments and review others' work. Expertiza also provides tools to visualize the scores and gauge the improvements made during the course semester. It also facilitates and monitors team projects. It is targeted at educational and non-profit organizations. The project is funded by the National Software Foundation (NSF), NCSU Learning in a Technology-Rich Environment (LITRE) program, the NCSU Faculty Center for Teaching and Learning, the NCSU STEM Initiative, and the Center for Advanced Computing and Communication.&lt;br /&gt;
&lt;br /&gt;
Expertiza is an open-source project with the source code available as a public repository on GitHub. It is developed using Ruby on Rails and is increasingly becoming robust thanks to the innumerable bugs being fixed by the community. The project has a micro-blog on SourceForge where the developer community report bugs and document updates.&lt;br /&gt;
&lt;br /&gt;
== Task Description ==&lt;br /&gt;
&lt;br /&gt;
1) Identifying the Expertiza pages which take time to load using Rack-mini-profiler and Flamegraphs.&lt;br /&gt;
&lt;br /&gt;
2) Propose fixes which would improve the Expertiza project.&lt;br /&gt;
&lt;br /&gt;
3) Optimizing the view, models and controllers for few of these corresponding fixes to improve the load time of these pages.&lt;br /&gt;
&lt;br /&gt;
== Gems Installed  ==&lt;br /&gt;
&lt;br /&gt;
*rack-mini-profiler :- Middleware that displays speed badge for every html page. Designed to work both in production and in development&lt;br /&gt;
*flamegraphs :- Flame graphs are a visualization of profiled software, allowing the most frequent code-paths to be identified quickly and accurately.&lt;br /&gt;
*stackprof:-A sampling call-stack profiler for ruby 2.1+.Downloaded as a dependency for rack-mini-profiler.&lt;br /&gt;
*fast_stack :-fast_stack is dynamically resizable data structure optimized for fast iteration over the large arrays of similar elements avoiding memory fragmentation.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
== Pages which needs to be optimized ==&lt;br /&gt;
&lt;br /&gt;
1)expertiza.ncsu.edu/tree_display/list&lt;br /&gt;
&lt;br /&gt;
2)expertiza.ncsu.edu/review_mapping/response_report&lt;br /&gt;
&lt;br /&gt;
3)expertiza.ncsu.edu/grades/view&lt;br /&gt;
&lt;br /&gt;
4)expertiza.ncsu.edu/users/list&lt;br /&gt;
&lt;br /&gt;
== Approach ==&lt;br /&gt;
In order to optimize, we need to understand the factors which are causing the lag. This can be identified by using the flamegraph generation method and rack-mini-profiler statistics. The statistics generated by rack miniprofiler help us to understand the time taken by each component to get loaded. From these statistics, we can identify the model/controller/view/database query which is causing this latency. From here, we can identify the methods which need to be refactored in order to optimize the webpage rendering.&lt;br /&gt;
&lt;br /&gt;
==Identification of pages ==&lt;br /&gt;
===Analysis of page 1: expertiza.ncsu.edu/tree_display/list ===&lt;br /&gt;
&lt;br /&gt;
===FlameGraph Statistics===&lt;br /&gt;
The following is the flamegraph for this page:-&lt;br /&gt;
[[File:f.png]]&lt;br /&gt;
&lt;br /&gt;
The X axis of the FlameGraph represents the time taken to load the page. It can give a clear picture of where the expertiza page is getting bogged down. The widest layers take the longest to run. They’re the areas one should look into, because speeding them up could have the biggest impact. As we can see over here, most of the time taken over here is in the controller action.&lt;br /&gt;
&lt;br /&gt;
===MiniProfiler Statistics===&lt;br /&gt;
&lt;br /&gt;
The following is the rack-mini-profiler statistics for the page:-&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tre1.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
The box which is seen in the leftmost corner is the MiniProfiler statistics. MiniProfiler gives  a constant notification of how long each page takes to load. The miniprofiler statistics show the time taken to render the view as well as the corresponding SQL calls.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree2.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
This image shows the time and the number of SQL calls which are required for each rendering.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree5.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
Here as we can see the total number of SQL calls required for children_node_ng is 1123. This is causing the latency in the entire page by 10564.8 ms. These statistics helped us to identify the method which needs to be refactored.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree6.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
The total number of SQL calls required for 2 components here is 2 each. Hence we do not need to refactor this component.&lt;br /&gt;
&lt;br /&gt;
===Identified Component causing the delay===&lt;br /&gt;
tree_display_controller&lt;br /&gt;
&lt;br /&gt;
The following methods are consuming most of the time in this code :-&lt;br /&gt;
&lt;br /&gt;
1)update_fnode_children&lt;br /&gt;
&lt;br /&gt;
2)initialize_fnode_update_children&lt;br /&gt;
&lt;br /&gt;
3)children_node_ng&lt;br /&gt;
&lt;br /&gt;
These methods are from line 172-201 in this controller.&lt;br /&gt;
&lt;br /&gt;
== Proposed Solution ==&lt;br /&gt;
The time taken to load the page is high due to the time taken for the action children_node_ng. The time taken to execute it is 10564.8 milliseconds. This is due to the 1123 SQL calls which are performed in the given action. This delay can be reduced by reducing the total number of SQL calls, which can be reduced by identifying the methods causing this delay as well as by refactoring the code. The solution is to refactor the code which has been attached below to improve the time taken to perform this action.&lt;br /&gt;
&lt;br /&gt;
  def update_fnode_children(fnode, tmp_res)&lt;br /&gt;
    # fnode is short for foldernode which is the parent node&lt;br /&gt;
    # ch_nodes are childrens&lt;br /&gt;
    # cnode = fnode.get_children(&amp;quot;created_at&amp;quot;, &amp;quot;desc&amp;quot;, 2, nil, nil)&lt;br /&gt;
    ch_nodes = fnode.get_children(nil, nil, session[:user].id, nil, nil)&lt;br /&gt;
    tmp_res[fnode.get_name] = ch_nodes&lt;br /&gt;
  end&lt;br /&gt;
&lt;br /&gt;
 &lt;br /&gt;
  # initialize parent node and update child nodes for it&lt;br /&gt;
  def initialize_fnode_update_children(params, node, tmp_res)&lt;br /&gt;
    fnode = (params[:reactParams][:nodeType]).constantize.new&lt;br /&gt;
    node.each do |a|&lt;br /&gt;
    fnode[a[0]] = a[1]&lt;br /&gt;
  end&lt;br /&gt;
    update_fnode_children(fnode, tmp_res)&lt;br /&gt;
    end&lt;br /&gt;
&lt;br /&gt;
  &lt;br /&gt;
  # for child nodes&lt;br /&gt;
  def children_node_ng&lt;br /&gt;
    child_nodes = child_nodes_from_params(params[:reactParams][:child_nodes])&lt;br /&gt;
    tmp_res = {}&lt;br /&gt;
    child_nodes.each do |node|&lt;br /&gt;
    initialize_fnode_update_children(params, node, tmp_res)&lt;br /&gt;
  end&lt;br /&gt;
    res = res_node_for_child(tmp_res)&lt;br /&gt;
    respond_to do |format|&lt;br /&gt;
    format.html { render json: res }&lt;br /&gt;
    end&lt;br /&gt;
    end&lt;/div&gt;</summary>
		<author><name>Krkulkar</name></author>
	</entry>
	<entry>
		<id>https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=112032</id>
		<title>CSC/ECE 517 Fall 2017/E17A8. Use a profiler to identify the problems / pages that take some time to load &amp; fix them</title>
		<link rel="alternate" type="text/html" href="https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=112032"/>
		<updated>2017-11-06T22:11:07Z</updated>

		<summary type="html">&lt;p&gt;Krkulkar: /* MiniProfiler Statistics */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;= Optimization for page loading in Expertiza =&lt;br /&gt;
&lt;br /&gt;
== Introduction ==&lt;br /&gt;
Expertiza is an online system that is used by students to view/submit assignments and review others' work. Expertiza also provides tools to visualize the scores and gauge the improvements made during the course semester. It also facilitates and monitors team projects. It is targeted at educational and non-profit organizations. The project is funded by the National Software Foundation (NSF), NCSU Learning in a Technology-Rich Environment (LITRE) program, the NCSU Faculty Center for Teaching and Learning, the NCSU STEM Initiative, and the Center for Advanced Computing and Communication.&lt;br /&gt;
&lt;br /&gt;
Expertiza is an open-source project with the source code available as a public repository on GitHub. It is developed using Ruby on Rails and is increasingly becoming robust thanks to the innumerable bugs being fixed by the community. The project has a micro-blog on SourceForge where the developer community report bugs and document updates.&lt;br /&gt;
&lt;br /&gt;
== Task Description ==&lt;br /&gt;
&lt;br /&gt;
1) Identifying the Expertiza pages which take time to load using Rack-mini-profiler and Flamegraphs.&lt;br /&gt;
&lt;br /&gt;
2) Propose fixes which would improve the Expertiza project.&lt;br /&gt;
&lt;br /&gt;
3) Optimizing the view, models and controllers for few of these corresponding fixes to improve the load time of these pages.&lt;br /&gt;
&lt;br /&gt;
== Gems Installed  ==&lt;br /&gt;
&lt;br /&gt;
*rack-mini-profiler :- Middleware that displays speed badge for every html page. Designed to work both in production and in development&lt;br /&gt;
*flamegraphs :- Flame graphs are a visualization of profiled software, allowing the most frequent code-paths to be identified quickly and accurately.&lt;br /&gt;
*stackprof:-A sampling call-stack profiler for ruby 2.1+.Downloaded as a dependency for rack-mini-profiler.&lt;br /&gt;
*fast_stack :-fast_stack is dynamically resizable data structure optimized for fast iteration over the large arrays of similar elements avoiding memory fragmentation.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
== Pages which needs to be optimized ==&lt;br /&gt;
&lt;br /&gt;
1)expertiza.ncsu.edu/tree_display/list&lt;br /&gt;
&lt;br /&gt;
2)expertiza.ncsu.edu/review_mapping/response_report&lt;br /&gt;
&lt;br /&gt;
3)expertiza.ncsu.edu/grades/view&lt;br /&gt;
&lt;br /&gt;
4)expertiza.ncsu.edu/users/list&lt;br /&gt;
&lt;br /&gt;
== Approach ==&lt;br /&gt;
In order to optimize, we need to understand the factors which are causing the lag. This can be identified by using the flamegraph generation method and rack-mini-profiler statistics. The statistics generated by rack miniprofiler help us to understand the time taken by each component to get loaded. From these statistics, we can identify the model/controller/view/database query which is causing this latency. From here, we can identify the methods which need to be refactored in order to optimize the webpage rendering.&lt;br /&gt;
&lt;br /&gt;
==Identification of pages ==&lt;br /&gt;
===Analysis of page 1: expertiza.ncsu.edu/tree_display/list ===&lt;br /&gt;
&lt;br /&gt;
===FlameGraph Statistics===&lt;br /&gt;
The following is the flamegraph for this page:-&lt;br /&gt;
[[File:f.png]]&lt;br /&gt;
&lt;br /&gt;
The X axis of the FlameGraph represents the time taken to load the page. It can give a clear picture of where the expertiza page is getting bogged down. The widest layers take the longest to run. They’re the areas one should look into, because speeding them up could have the biggest impact. As we can see over here, most of the time taken over here is in the controller action.&lt;br /&gt;
&lt;br /&gt;
===MiniProfiler Statistics===&lt;br /&gt;
&lt;br /&gt;
The following is the rack-mini-profiler statistics for the page:-&lt;br /&gt;
&lt;br /&gt;
[[File:tre1.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
The box which is seen in the leftmost corner is the MiniProfiler statistics. MiniProfiler gives  a constant notification of how long each page takes to load. The miniprofiler statistics show the time taken to render the view as well as the corresponding SQL calls.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree2.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
This image shows the time and the number of SQL calls which are required for each rendering.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree5.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
Here as we can see the total number of SQL calls required for children_node_ng is 1123. This is causing the latency in the entire page by 10564.8 ms. These statistics helped us to identify the method which needs to be refactored.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree6.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
The total number of SQL calls required for 2 components here is 2 each. Hence we do not need to refactor this component.&lt;br /&gt;
&lt;br /&gt;
===Identified Component causing the delay===&lt;br /&gt;
tree_display_controller&lt;br /&gt;
&lt;br /&gt;
The following methods are consuming most of the time in this code :-&lt;br /&gt;
&lt;br /&gt;
1)update_fnode_children&lt;br /&gt;
&lt;br /&gt;
2)initialize_fnode_update_children&lt;br /&gt;
&lt;br /&gt;
3)children_node_ng&lt;br /&gt;
&lt;br /&gt;
These methods are from line 172-201 in this controller.&lt;br /&gt;
&lt;br /&gt;
== Proposed Solution ==&lt;br /&gt;
The time taken to load the page is high due to the time taken for the action children_node_ng. The time taken to execute it is 10564.8 milliseconds. This is due to the 1123 SQL calls which are performed in the given action. This delay can be reduced by reducing the total number of SQL calls, which can be reduced by identifying the methods causing this delay as well as by refactoring the code. The solution is to refactor the code which has been attached below to improve the time taken to perform this action.&lt;br /&gt;
&lt;br /&gt;
  def update_fnode_children(fnode, tmp_res)&lt;br /&gt;
    # fnode is short for foldernode which is the parent node&lt;br /&gt;
    # ch_nodes are childrens&lt;br /&gt;
    # cnode = fnode.get_children(&amp;quot;created_at&amp;quot;, &amp;quot;desc&amp;quot;, 2, nil, nil)&lt;br /&gt;
    ch_nodes = fnode.get_children(nil, nil, session[:user].id, nil, nil)&lt;br /&gt;
    tmp_res[fnode.get_name] = ch_nodes&lt;br /&gt;
  end&lt;br /&gt;
&lt;br /&gt;
 &lt;br /&gt;
  # initialize parent node and update child nodes for it&lt;br /&gt;
  def initialize_fnode_update_children(params, node, tmp_res)&lt;br /&gt;
    fnode = (params[:reactParams][:nodeType]).constantize.new&lt;br /&gt;
    node.each do |a|&lt;br /&gt;
    fnode[a[0]] = a[1]&lt;br /&gt;
  end&lt;br /&gt;
    update_fnode_children(fnode, tmp_res)&lt;br /&gt;
    end&lt;br /&gt;
&lt;br /&gt;
  &lt;br /&gt;
  # for child nodes&lt;br /&gt;
  def children_node_ng&lt;br /&gt;
    child_nodes = child_nodes_from_params(params[:reactParams][:child_nodes])&lt;br /&gt;
    tmp_res = {}&lt;br /&gt;
    child_nodes.each do |node|&lt;br /&gt;
    initialize_fnode_update_children(params, node, tmp_res)&lt;br /&gt;
  end&lt;br /&gt;
    res = res_node_for_child(tmp_res)&lt;br /&gt;
    respond_to do |format|&lt;br /&gt;
    format.html { render json: res }&lt;br /&gt;
    end&lt;br /&gt;
    end&lt;/div&gt;</summary>
		<author><name>Krkulkar</name></author>
	</entry>
	<entry>
		<id>https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=112031</id>
		<title>CSC/ECE 517 Fall 2017/E17A8. Use a profiler to identify the problems / pages that take some time to load &amp; fix them</title>
		<link rel="alternate" type="text/html" href="https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=112031"/>
		<updated>2017-11-06T22:09:23Z</updated>

		<summary type="html">&lt;p&gt;Krkulkar: /* Proposed Solution */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;= Optimization for page loading in Expertiza =&lt;br /&gt;
&lt;br /&gt;
== Introduction ==&lt;br /&gt;
Expertiza is an online system that is used by students to view/submit assignments and review others' work. Expertiza also provides tools to visualize the scores and gauge the improvements made during the course semester. It also facilitates and monitors team projects. It is targeted at educational and non-profit organizations. The project is funded by the National Software Foundation (NSF), NCSU Learning in a Technology-Rich Environment (LITRE) program, the NCSU Faculty Center for Teaching and Learning, the NCSU STEM Initiative, and the Center for Advanced Computing and Communication.&lt;br /&gt;
&lt;br /&gt;
Expertiza is an open-source project with the source code available as a public repository on GitHub. It is developed using Ruby on Rails and is increasingly becoming robust thanks to the innumerable bugs being fixed by the community. The project has a micro-blog on SourceForge where the developer community report bugs and document updates.&lt;br /&gt;
&lt;br /&gt;
== Task Description ==&lt;br /&gt;
&lt;br /&gt;
1) Identifying the Expertiza pages which take time to load using Rack-mini-profiler and Flamegraphs.&lt;br /&gt;
&lt;br /&gt;
2) Propose fixes which would improve the Expertiza project.&lt;br /&gt;
&lt;br /&gt;
3) Optimizing the view, models and controllers for few of these corresponding fixes to improve the load time of these pages.&lt;br /&gt;
&lt;br /&gt;
== Gems Installed  ==&lt;br /&gt;
&lt;br /&gt;
*rack-mini-profiler :- Middleware that displays speed badge for every html page. Designed to work both in production and in development&lt;br /&gt;
*flamegraphs :- Flame graphs are a visualization of profiled software, allowing the most frequent code-paths to be identified quickly and accurately.&lt;br /&gt;
*stackprof:-A sampling call-stack profiler for ruby 2.1+.Downloaded as a dependency for rack-mini-profiler.&lt;br /&gt;
*fast_stack :-fast_stack is dynamically resizable data structure optimized for fast iteration over the large arrays of similar elements avoiding memory fragmentation.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
== Pages which needs to be optimized ==&lt;br /&gt;
&lt;br /&gt;
1)expertiza.ncsu.edu/tree_display/list&lt;br /&gt;
&lt;br /&gt;
2)expertiza.ncsu.edu/review_mapping/response_report&lt;br /&gt;
&lt;br /&gt;
3)expertiza.ncsu.edu/grades/view&lt;br /&gt;
&lt;br /&gt;
4)expertiza.ncsu.edu/users/list&lt;br /&gt;
&lt;br /&gt;
== Approach ==&lt;br /&gt;
In order to optimize, we need to understand the factors which are causing the lag. This can be identified by using the flamegraph generation method and rack-mini-profiler statistics. The statistics generated by rack miniprofiler help us to understand the time taken by each component to get loaded. From these statistics, we can identify the model/controller/view/database query which is causing this latency. From here, we can identify the methods which need to be refactored in order to optimize the webpage rendering.&lt;br /&gt;
&lt;br /&gt;
==Identification of pages ==&lt;br /&gt;
===Analysis of page 1: expertiza.ncsu.edu/tree_display/list ===&lt;br /&gt;
&lt;br /&gt;
===FlameGraph Statistics===&lt;br /&gt;
The following is the flamegraph for this page:-&lt;br /&gt;
[[File:f.png]]&lt;br /&gt;
&lt;br /&gt;
The X axis of the FlameGraph represents the time taken to load the page. It can give a clear picture of where the expertiza page is getting bogged down. The widest layers take the longest to run. They’re the areas one should look into, because speeding them up could have the biggest impact. As we can see over here, most of the time taken over here is in the controller action.&lt;br /&gt;
&lt;br /&gt;
===MiniProfiler Statistics===&lt;br /&gt;
The following is the rack-mini-profiler statistics for the page:-&lt;br /&gt;
[[File:tre1.png]]&lt;br /&gt;
&lt;br /&gt;
The box which is seen in the leftmost corner is the MiniProfiler statistics. MiniProfiler gives  a constant notification of how long each page takes to load. The miniprofiler statistics show the time taken to render the view as well as the corresponding SQL calls.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree2.png]]&lt;br /&gt;
&lt;br /&gt;
This image shows the time and the number of SQL calls which are required for each rendering.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree5.png]]&lt;br /&gt;
&lt;br /&gt;
Here as we can see the total number of SQL calls required for children_node_ng is 1123. This is causing the latency in the entire page by 10564.8 ms. These statistics helped us to identify the method which needs to be refactored.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree6.png]]&lt;br /&gt;
&lt;br /&gt;
The total number of SQL calls required for 2 components here is 2 each. Hence we do not need to refactor this component.&lt;br /&gt;
&lt;br /&gt;
===Identified Component causing the delay===&lt;br /&gt;
tree_display_controller&lt;br /&gt;
&lt;br /&gt;
The following methods are consuming most of the time in this code :-&lt;br /&gt;
&lt;br /&gt;
1)update_fnode_children&lt;br /&gt;
&lt;br /&gt;
2)initialize_fnode_update_children&lt;br /&gt;
&lt;br /&gt;
3)children_node_ng&lt;br /&gt;
&lt;br /&gt;
These methods are from line 172-201 in this controller.&lt;br /&gt;
&lt;br /&gt;
== Proposed Solution ==&lt;br /&gt;
The time taken to load the page is high due to the time taken for the action children_node_ng. The time taken to execute it is 10564.8 milliseconds. This is due to the 1123 SQL calls which are performed in the given action. This delay can be reduced by reducing the total number of SQL calls, which can be reduced by identifying the methods causing this delay as well as by refactoring the code. The solution is to refactor the code which has been attached below to improve the time taken to perform this action.&lt;br /&gt;
&lt;br /&gt;
  def update_fnode_children(fnode, tmp_res)&lt;br /&gt;
    # fnode is short for foldernode which is the parent node&lt;br /&gt;
    # ch_nodes are childrens&lt;br /&gt;
    # cnode = fnode.get_children(&amp;quot;created_at&amp;quot;, &amp;quot;desc&amp;quot;, 2, nil, nil)&lt;br /&gt;
    ch_nodes = fnode.get_children(nil, nil, session[:user].id, nil, nil)&lt;br /&gt;
    tmp_res[fnode.get_name] = ch_nodes&lt;br /&gt;
  end&lt;br /&gt;
&lt;br /&gt;
 &lt;br /&gt;
  # initialize parent node and update child nodes for it&lt;br /&gt;
  def initialize_fnode_update_children(params, node, tmp_res)&lt;br /&gt;
    fnode = (params[:reactParams][:nodeType]).constantize.new&lt;br /&gt;
    node.each do |a|&lt;br /&gt;
    fnode[a[0]] = a[1]&lt;br /&gt;
  end&lt;br /&gt;
    update_fnode_children(fnode, tmp_res)&lt;br /&gt;
    end&lt;br /&gt;
&lt;br /&gt;
  &lt;br /&gt;
  # for child nodes&lt;br /&gt;
  def children_node_ng&lt;br /&gt;
    child_nodes = child_nodes_from_params(params[:reactParams][:child_nodes])&lt;br /&gt;
    tmp_res = {}&lt;br /&gt;
    child_nodes.each do |node|&lt;br /&gt;
    initialize_fnode_update_children(params, node, tmp_res)&lt;br /&gt;
  end&lt;br /&gt;
    res = res_node_for_child(tmp_res)&lt;br /&gt;
    respond_to do |format|&lt;br /&gt;
    format.html { render json: res }&lt;br /&gt;
    end&lt;br /&gt;
    end&lt;/div&gt;</summary>
		<author><name>Krkulkar</name></author>
	</entry>
	<entry>
		<id>https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=112030</id>
		<title>CSC/ECE 517 Fall 2017/E17A8. Use a profiler to identify the problems / pages that take some time to load &amp; fix them</title>
		<link rel="alternate" type="text/html" href="https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=112030"/>
		<updated>2017-11-06T22:07:34Z</updated>

		<summary type="html">&lt;p&gt;Krkulkar: /* Solution */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;= Optimization for page loading in Expertiza =&lt;br /&gt;
&lt;br /&gt;
== Introduction ==&lt;br /&gt;
Expertiza is an online system that is used by students to view/submit assignments and review others' work. Expertiza also provides tools to visualize the scores and gauge the improvements made during the course semester. It also facilitates and monitors team projects. It is targeted at educational and non-profit organizations. The project is funded by the National Software Foundation (NSF), NCSU Learning in a Technology-Rich Environment (LITRE) program, the NCSU Faculty Center for Teaching and Learning, the NCSU STEM Initiative, and the Center for Advanced Computing and Communication.&lt;br /&gt;
&lt;br /&gt;
Expertiza is an open-source project with the source code available as a public repository on GitHub. It is developed using Ruby on Rails and is increasingly becoming robust thanks to the innumerable bugs being fixed by the community. The project has a micro-blog on SourceForge where the developer community report bugs and document updates.&lt;br /&gt;
&lt;br /&gt;
== Task Description ==&lt;br /&gt;
&lt;br /&gt;
1) Identifying the Expertiza pages which take time to load using Rack-mini-profiler and Flamegraphs.&lt;br /&gt;
&lt;br /&gt;
2) Propose fixes which would improve the Expertiza project.&lt;br /&gt;
&lt;br /&gt;
3) Optimizing the view, models and controllers for few of these corresponding fixes to improve the load time of these pages.&lt;br /&gt;
&lt;br /&gt;
== Gems Installed  ==&lt;br /&gt;
&lt;br /&gt;
*rack-mini-profiler :- Middleware that displays speed badge for every html page. Designed to work both in production and in development&lt;br /&gt;
*flamegraphs :- Flame graphs are a visualization of profiled software, allowing the most frequent code-paths to be identified quickly and accurately.&lt;br /&gt;
*stackprof:-A sampling call-stack profiler for ruby 2.1+.Downloaded as a dependency for rack-mini-profiler.&lt;br /&gt;
*fast_stack :-fast_stack is dynamically resizable data structure optimized for fast iteration over the large arrays of similar elements avoiding memory fragmentation.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
== Pages which needs to be optimized ==&lt;br /&gt;
&lt;br /&gt;
1)expertiza.ncsu.edu/tree_display/list&lt;br /&gt;
&lt;br /&gt;
2)expertiza.ncsu.edu/review_mapping/response_report&lt;br /&gt;
&lt;br /&gt;
3)expertiza.ncsu.edu/grades/view&lt;br /&gt;
&lt;br /&gt;
4)expertiza.ncsu.edu/users/list&lt;br /&gt;
&lt;br /&gt;
== Approach ==&lt;br /&gt;
In order to optimize, we need to understand the factors which are causing the lag. This can be identified by using the flamegraph generation method and rack-mini-profiler statistics. The statistics generated by rack miniprofiler help us to understand the time taken by each component to get loaded. From these statistics, we can identify the model/controller/view/database query which is causing this latency. From here, we can identify the methods which need to be refactored in order to optimize the webpage rendering.&lt;br /&gt;
&lt;br /&gt;
==Identification of pages ==&lt;br /&gt;
===Analysis of page 1: expertiza.ncsu.edu/tree_display/list ===&lt;br /&gt;
&lt;br /&gt;
===FlameGraph Statistics===&lt;br /&gt;
The following is the flamegraph for this page:-&lt;br /&gt;
[[File:f.png]]&lt;br /&gt;
&lt;br /&gt;
The X axis of the FlameGraph represents the time taken to load the page. It can give a clear picture of where the expertiza page is getting bogged down. The widest layers take the longest to run. They’re the areas one should look into, because speeding them up could have the biggest impact. As we can see over here, most of the time taken over here is in the controller action.&lt;br /&gt;
&lt;br /&gt;
===MiniProfiler Statistics===&lt;br /&gt;
The following is the rack-mini-profiler statistics for the page:-&lt;br /&gt;
[[File:tre1.png]]&lt;br /&gt;
&lt;br /&gt;
The box which is seen in the leftmost corner is the MiniProfiler statistics. MiniProfiler gives  a constant notification of how long each page takes to load. The miniprofiler statistics show the time taken to render the view as well as the corresponding SQL calls.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree2.png]]&lt;br /&gt;
&lt;br /&gt;
This image shows the time and the number of SQL calls which are required for each rendering.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree5.png]]&lt;br /&gt;
&lt;br /&gt;
Here as we can see the total number of SQL calls required for children_node_ng is 1123. This is causing the latency in the entire page by 10564.8 ms. These statistics helped us to identify the method which needs to be refactored.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree6.png]]&lt;br /&gt;
&lt;br /&gt;
The total number of SQL calls required for 2 components here is 2 each. Hence we do not need to refactor this component.&lt;br /&gt;
&lt;br /&gt;
===Identified Component causing the delay===&lt;br /&gt;
tree_display_controller&lt;br /&gt;
&lt;br /&gt;
The following methods are consuming most of the time in this code :-&lt;br /&gt;
&lt;br /&gt;
1)update_fnode_children&lt;br /&gt;
&lt;br /&gt;
2)initialize_fnode_update_children&lt;br /&gt;
&lt;br /&gt;
3)children_node_ng&lt;br /&gt;
&lt;br /&gt;
These methods are from line 172-201 in this controller.&lt;br /&gt;
&lt;br /&gt;
== Proposed Solution ==&lt;br /&gt;
So here as we can see the time taken to load the page is high due to the time taken for the action :children_node_ng.The time taken to execute it is 10564.8 milliseconds.This is due to the 1123 SQL calls which are performed in the given action .This delay can be reduced by reducing the total number of SQL calls which can be basically reduced by identifying the methods causing this delay as well as by refactoring the code. The solution is to refactor the code which has been attached below to improve the time taken to perform this action.&lt;br /&gt;
&lt;br /&gt;
  def update_fnode_children(fnode, tmp_res)&lt;br /&gt;
    # fnode is short for foldernode which is the parent node&lt;br /&gt;
    # ch_nodes are childrens&lt;br /&gt;
    # cnode = fnode.get_children(&amp;quot;created_at&amp;quot;, &amp;quot;desc&amp;quot;, 2, nil, nil)&lt;br /&gt;
    ch_nodes = fnode.get_children(nil, nil, session[:user].id, nil, nil)&lt;br /&gt;
    tmp_res[fnode.get_name] = ch_nodes&lt;br /&gt;
  end&lt;br /&gt;
&lt;br /&gt;
 &lt;br /&gt;
  # initialize parent node and update child nodes for it&lt;br /&gt;
  def initialize_fnode_update_children(params, node, tmp_res)&lt;br /&gt;
    fnode = (params[:reactParams][:nodeType]).constantize.new&lt;br /&gt;
    node.each do |a|&lt;br /&gt;
    fnode[a[0]] = a[1]&lt;br /&gt;
  end&lt;br /&gt;
    update_fnode_children(fnode, tmp_res)&lt;br /&gt;
    end&lt;br /&gt;
&lt;br /&gt;
  &lt;br /&gt;
  # for child nodes&lt;br /&gt;
  def children_node_ng&lt;br /&gt;
    child_nodes = child_nodes_from_params(params[:reactParams][:child_nodes])&lt;br /&gt;
    tmp_res = {}&lt;br /&gt;
    child_nodes.each do |node|&lt;br /&gt;
    initialize_fnode_update_children(params, node, tmp_res)&lt;br /&gt;
  end&lt;br /&gt;
    res = res_node_for_child(tmp_res)&lt;br /&gt;
    respond_to do |format|&lt;br /&gt;
    format.html { render json: res }&lt;br /&gt;
    end&lt;br /&gt;
    end&lt;/div&gt;</summary>
		<author><name>Krkulkar</name></author>
	</entry>
	<entry>
		<id>https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=112029</id>
		<title>CSC/ECE 517 Fall 2017/E17A8. Use a profiler to identify the problems / pages that take some time to load &amp; fix them</title>
		<link rel="alternate" type="text/html" href="https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=112029"/>
		<updated>2017-11-06T22:07:23Z</updated>

		<summary type="html">&lt;p&gt;Krkulkar: &lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;= Optimization for page loading in Expertiza =&lt;br /&gt;
&lt;br /&gt;
== Introduction ==&lt;br /&gt;
Expertiza is an online system that is used by students to view/submit assignments and review others' work. Expertiza also provides tools to visualize the scores and gauge the improvements made during the course semester. It also facilitates and monitors team projects. It is targeted at educational and non-profit organizations. The project is funded by the National Software Foundation (NSF), NCSU Learning in a Technology-Rich Environment (LITRE) program, the NCSU Faculty Center for Teaching and Learning, the NCSU STEM Initiative, and the Center for Advanced Computing and Communication.&lt;br /&gt;
&lt;br /&gt;
Expertiza is an open-source project with the source code available as a public repository on GitHub. It is developed using Ruby on Rails and is increasingly becoming robust thanks to the innumerable bugs being fixed by the community. The project has a micro-blog on SourceForge where the developer community report bugs and document updates.&lt;br /&gt;
&lt;br /&gt;
== Task Description ==&lt;br /&gt;
&lt;br /&gt;
1) Identifying the Expertiza pages which take time to load using Rack-mini-profiler and Flamegraphs.&lt;br /&gt;
&lt;br /&gt;
2) Propose fixes which would improve the Expertiza project.&lt;br /&gt;
&lt;br /&gt;
3) Optimizing the view, models and controllers for few of these corresponding fixes to improve the load time of these pages.&lt;br /&gt;
&lt;br /&gt;
== Gems Installed  ==&lt;br /&gt;
&lt;br /&gt;
*rack-mini-profiler :- Middleware that displays speed badge for every html page. Designed to work both in production and in development&lt;br /&gt;
*flamegraphs :- Flame graphs are a visualization of profiled software, allowing the most frequent code-paths to be identified quickly and accurately.&lt;br /&gt;
*stackprof:-A sampling call-stack profiler for ruby 2.1+.Downloaded as a dependency for rack-mini-profiler.&lt;br /&gt;
*fast_stack :-fast_stack is dynamically resizable data structure optimized for fast iteration over the large arrays of similar elements avoiding memory fragmentation.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
== Pages which needs to be optimized ==&lt;br /&gt;
&lt;br /&gt;
1)expertiza.ncsu.edu/tree_display/list&lt;br /&gt;
&lt;br /&gt;
2)expertiza.ncsu.edu/review_mapping/response_report&lt;br /&gt;
&lt;br /&gt;
3)expertiza.ncsu.edu/grades/view&lt;br /&gt;
&lt;br /&gt;
4)expertiza.ncsu.edu/users/list&lt;br /&gt;
&lt;br /&gt;
== Approach ==&lt;br /&gt;
In order to optimize, we need to understand the factors which are causing the lag. This can be identified by using the flamegraph generation method and rack-mini-profiler statistics. The statistics generated by rack miniprofiler help us to understand the time taken by each component to get loaded. From these statistics, we can identify the model/controller/view/database query which is causing this latency. From here, we can identify the methods which need to be refactored in order to optimize the webpage rendering.&lt;br /&gt;
&lt;br /&gt;
==Identification of pages ==&lt;br /&gt;
===Analysis of page 1: expertiza.ncsu.edu/tree_display/list ===&lt;br /&gt;
&lt;br /&gt;
===FlameGraph Statistics===&lt;br /&gt;
The following is the flamegraph for this page:-&lt;br /&gt;
[[File:f.png]]&lt;br /&gt;
&lt;br /&gt;
The X axis of the FlameGraph represents the time taken to load the page. It can give a clear picture of where the expertiza page is getting bogged down. The widest layers take the longest to run. They’re the areas one should look into, because speeding them up could have the biggest impact. As we can see over here, most of the time taken over here is in the controller action.&lt;br /&gt;
&lt;br /&gt;
===MiniProfiler Statistics===&lt;br /&gt;
The following is the rack-mini-profiler statistics for the page:-&lt;br /&gt;
[[File:tre1.png]]&lt;br /&gt;
&lt;br /&gt;
The box which is seen in the leftmost corner is the MiniProfiler statistics. MiniProfiler gives  a constant notification of how long each page takes to load. The miniprofiler statistics show the time taken to render the view as well as the corresponding SQL calls.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree2.png]]&lt;br /&gt;
&lt;br /&gt;
This image shows the time and the number of SQL calls which are required for each rendering.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree5.png]]&lt;br /&gt;
&lt;br /&gt;
Here as we can see the total number of SQL calls required for children_node_ng is 1123. This is causing the latency in the entire page by 10564.8 ms. These statistics helped us to identify the method which needs to be refactored.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree6.png]]&lt;br /&gt;
&lt;br /&gt;
The total number of SQL calls required for 2 components here is 2 each. Hence we do not need to refactor this component.&lt;br /&gt;
&lt;br /&gt;
===Identified Component causing the delay===&lt;br /&gt;
tree_display_controller&lt;br /&gt;
&lt;br /&gt;
The following methods are consuming most of the time in this code :-&lt;br /&gt;
&lt;br /&gt;
1)update_fnode_children&lt;br /&gt;
&lt;br /&gt;
2)initialize_fnode_update_children&lt;br /&gt;
&lt;br /&gt;
3)children_node_ng&lt;br /&gt;
&lt;br /&gt;
These methods are from line 172-201 in this controller.&lt;br /&gt;
&lt;br /&gt;
===Solution===&lt;br /&gt;
So here as we can see the time taken to load the page is high due to the time taken for the action :children_node_ng.The time taken to execute it is 10564.8 milliseconds.This is due to the 1123 SQL calls which are performed in the given action .This delay can be reduced by reducing the total number of SQL calls which can be basically reduced by identifying the methods causing this delay as well as by refactoring the code. The solution is to refactor the code which has been attached below to improve the time taken to perform this action.&lt;br /&gt;
&lt;br /&gt;
  def update_fnode_children(fnode, tmp_res)&lt;br /&gt;
    # fnode is short for foldernode which is the parent node&lt;br /&gt;
    # ch_nodes are childrens&lt;br /&gt;
    # cnode = fnode.get_children(&amp;quot;created_at&amp;quot;, &amp;quot;desc&amp;quot;, 2, nil, nil)&lt;br /&gt;
    ch_nodes = fnode.get_children(nil, nil, session[:user].id, nil, nil)&lt;br /&gt;
    tmp_res[fnode.get_name] = ch_nodes&lt;br /&gt;
  end&lt;br /&gt;
&lt;br /&gt;
 &lt;br /&gt;
  # initialize parent node and update child nodes for it&lt;br /&gt;
  def initialize_fnode_update_children(params, node, tmp_res)&lt;br /&gt;
    fnode = (params[:reactParams][:nodeType]).constantize.new&lt;br /&gt;
    node.each do |a|&lt;br /&gt;
    fnode[a[0]] = a[1]&lt;br /&gt;
  end&lt;br /&gt;
    update_fnode_children(fnode, tmp_res)&lt;br /&gt;
    end&lt;br /&gt;
&lt;br /&gt;
  &lt;br /&gt;
  # for child nodes&lt;br /&gt;
  def children_node_ng&lt;br /&gt;
    child_nodes = child_nodes_from_params(params[:reactParams][:child_nodes])&lt;br /&gt;
    tmp_res = {}&lt;br /&gt;
    child_nodes.each do |node|&lt;br /&gt;
    initialize_fnode_update_children(params, node, tmp_res)&lt;br /&gt;
  end&lt;br /&gt;
    res = res_node_for_child(tmp_res)&lt;br /&gt;
    respond_to do |format|&lt;br /&gt;
    format.html { render json: res }&lt;br /&gt;
    end&lt;br /&gt;
    end&lt;br /&gt;
&lt;br /&gt;
== Proposed Solution ==&lt;br /&gt;
So here as we can see the time taken to load the page is high due to the time taken for the action :children_node_ng.The time taken to execute it is 10564.8 milliseconds.This is due to the 1123 SQL calls which are performed in the given action .This delay can be reduced by reducing the total number of SQL calls which can be basically reduced by identifying the methods causing this delay as well as by refactoring the code. The solution is to refactor the code which has been attached below to improve the time taken to perform this action.&lt;br /&gt;
&lt;br /&gt;
  def update_fnode_children(fnode, tmp_res)&lt;br /&gt;
    # fnode is short for foldernode which is the parent node&lt;br /&gt;
    # ch_nodes are childrens&lt;br /&gt;
    # cnode = fnode.get_children(&amp;quot;created_at&amp;quot;, &amp;quot;desc&amp;quot;, 2, nil, nil)&lt;br /&gt;
    ch_nodes = fnode.get_children(nil, nil, session[:user].id, nil, nil)&lt;br /&gt;
    tmp_res[fnode.get_name] = ch_nodes&lt;br /&gt;
  end&lt;br /&gt;
&lt;br /&gt;
 &lt;br /&gt;
  # initialize parent node and update child nodes for it&lt;br /&gt;
  def initialize_fnode_update_children(params, node, tmp_res)&lt;br /&gt;
    fnode = (params[:reactParams][:nodeType]).constantize.new&lt;br /&gt;
    node.each do |a|&lt;br /&gt;
    fnode[a[0]] = a[1]&lt;br /&gt;
  end&lt;br /&gt;
    update_fnode_children(fnode, tmp_res)&lt;br /&gt;
    end&lt;br /&gt;
&lt;br /&gt;
  &lt;br /&gt;
  # for child nodes&lt;br /&gt;
  def children_node_ng&lt;br /&gt;
    child_nodes = child_nodes_from_params(params[:reactParams][:child_nodes])&lt;br /&gt;
    tmp_res = {}&lt;br /&gt;
    child_nodes.each do |node|&lt;br /&gt;
    initialize_fnode_update_children(params, node, tmp_res)&lt;br /&gt;
  end&lt;br /&gt;
    res = res_node_for_child(tmp_res)&lt;br /&gt;
    respond_to do |format|&lt;br /&gt;
    format.html { render json: res }&lt;br /&gt;
    end&lt;br /&gt;
    end&lt;/div&gt;</summary>
		<author><name>Krkulkar</name></author>
	</entry>
	<entry>
		<id>https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=112028</id>
		<title>CSC/ECE 517 Fall 2017/E17A8. Use a profiler to identify the problems / pages that take some time to load &amp; fix them</title>
		<link rel="alternate" type="text/html" href="https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=112028"/>
		<updated>2017-11-06T22:04:27Z</updated>

		<summary type="html">&lt;p&gt;Krkulkar: /* Task Description */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;= Optimization for page loading in Expertiza =&lt;br /&gt;
&lt;br /&gt;
== Introduction ==&lt;br /&gt;
Expertiza is an online system that is used by students to view/submit assignments and review others' work. Expertiza also provides tools to visualize the scores and gauge the improvements made during the course semester. It also facilitates and monitors team projects. It is targeted at educational and non-profit organizations. The project is funded by the National Software Foundation (NSF), NCSU Learning in a Technology-Rich Environment (LITRE) program, the NCSU Faculty Center for Teaching and Learning, the NCSU STEM Initiative, and the Center for Advanced Computing and Communication.&lt;br /&gt;
&lt;br /&gt;
Expertiza is an open-source project with the source code available as a public repository on GitHub. It is developed using Ruby on Rails and is increasingly becoming robust thanks to the innumerable bugs being fixed by the community. The project has a micro-blog on SourceForge where the developer community report bugs and document updates.&lt;br /&gt;
&lt;br /&gt;
== Task Description ==&lt;br /&gt;
&lt;br /&gt;
1) Identifying the Expertiza pages which take time to load using Rack-mini-profiler and Flamegraphs.&lt;br /&gt;
&lt;br /&gt;
2) Propose fixes which would improve the Expertiza project.&lt;br /&gt;
&lt;br /&gt;
3) Optimizing the view, models and controllers for few of these corresponding fixes to improve the load time of these pages.&lt;br /&gt;
&lt;br /&gt;
== Gems Installed  ==&lt;br /&gt;
&lt;br /&gt;
*rack-mini-profiler :- Middleware that displays speed badge for every html page. Designed to work both in production and in development&lt;br /&gt;
*flamegraphs :- Flame graphs are a visualization of profiled software, allowing the most frequent code-paths to be identified quickly and accurately.&lt;br /&gt;
*stackprof:-A sampling call-stack profiler for ruby 2.1+.Downloaded as a dependency for rack-mini-profiler.&lt;br /&gt;
*fast_stack :-fast_stack is dynamically resizable data structure optimized for fast iteration over the large arrays of similar elements avoiding memory fragmentation.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
== Pages which needs to be optimized ==&lt;br /&gt;
&lt;br /&gt;
1)expertiza.ncsu.edu/tree_display/list&lt;br /&gt;
&lt;br /&gt;
2)expertiza.ncsu.edu/review_mapping/response_report&lt;br /&gt;
&lt;br /&gt;
3)expertiza.ncsu.edu/grades/view&lt;br /&gt;
&lt;br /&gt;
4)expertiza.ncsu.edu/users/list&lt;br /&gt;
&lt;br /&gt;
== Approach ==&lt;br /&gt;
In order to optimize, we need to understand the factors which are causing the lag. This can be identified by using the flamegraph generation method and rack-mini-profiler statistics. The statistics generated by rack miniprofiler help us to understand the time taken by each component to get loaded. From these statistics, we can identify the model/controller/view/database query which is causing this latency. From here, we can identify the methods which need to be refactored in order to optimize the webpage rendering.&lt;br /&gt;
&lt;br /&gt;
==Identification of pages ==&lt;br /&gt;
===Analysis of page 1: expertiza.ncsu.edu/tree_display/list ===&lt;br /&gt;
&lt;br /&gt;
===FlameGraph Statistics===&lt;br /&gt;
The following is the flamegraph for this page:-&lt;br /&gt;
[[File:f.png]]&lt;br /&gt;
&lt;br /&gt;
The X axis of the FlameGraph represents the time taken to load the page. It can give a clear picture of where the expertiza page is getting bogged down. The widest layers take the longest to run. They’re the areas one should look into, because speeding them up could have the biggest impact. As we can see over here, most of the time taken over here is in the controller action.&lt;br /&gt;
&lt;br /&gt;
===MiniProfiler Statistics===&lt;br /&gt;
The following is the rack-mini-profiler statistics for the page:-&lt;br /&gt;
[[File:tre1.png]]&lt;br /&gt;
&lt;br /&gt;
The box which is seen in the leftmost corner is the MiniProfiler statistics. MiniProfiler gives  a constant notification of how long each page takes to load. The miniprofiler statistics show the time taken to render the view as well as the corresponding SQL calls.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree2.png]]&lt;br /&gt;
&lt;br /&gt;
This image shows the time and the number of SQL calls which are required for each rendering.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree5.png]]&lt;br /&gt;
&lt;br /&gt;
Here as we can see the total number of SQL calls required for children_node_ng is 1123. This is causing the latency in the entire page by 10564.8 ms. These statistics helped us to identify the method which needs to be refactored.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree6.png]]&lt;br /&gt;
&lt;br /&gt;
The total number of SQL calls required for 2 components here is 2 each. Hence we do not need to refactor this component.&lt;br /&gt;
&lt;br /&gt;
===Identified Component causing the delay===&lt;br /&gt;
tree_display_controller&lt;br /&gt;
&lt;br /&gt;
The following methods are consuming most of the time in this code :-&lt;br /&gt;
&lt;br /&gt;
1)update_fnode_children&lt;br /&gt;
&lt;br /&gt;
2)initialize_fnode_update_children&lt;br /&gt;
&lt;br /&gt;
3)children_node_ng&lt;br /&gt;
&lt;br /&gt;
These methods are from line 172-201 in this controller.&lt;br /&gt;
&lt;br /&gt;
===Solution===&lt;br /&gt;
So here as we can see the time taken to load the page is high due to the time taken for the action :children_node_ng.The time taken to execute it is 10564.8 milliseconds.This is due to the 1123 SQL calls which are performed in the given action .This delay can be reduced by reducing the total number of SQL calls which can be basically reduced by identifying the methods causing this delay as well as by refactoring the code. The solution is to refactor the code which has been attached below to improve the time taken to perform this action.&lt;br /&gt;
&lt;br /&gt;
  def update_fnode_children(fnode, tmp_res)&lt;br /&gt;
    # fnode is short for foldernode which is the parent node&lt;br /&gt;
    # ch_nodes are childrens&lt;br /&gt;
    # cnode = fnode.get_children(&amp;quot;created_at&amp;quot;, &amp;quot;desc&amp;quot;, 2, nil, nil)&lt;br /&gt;
    ch_nodes = fnode.get_children(nil, nil, session[:user].id, nil, nil)&lt;br /&gt;
    tmp_res[fnode.get_name] = ch_nodes&lt;br /&gt;
  end&lt;br /&gt;
&lt;br /&gt;
 &lt;br /&gt;
  # initialize parent node and update child nodes for it&lt;br /&gt;
  def initialize_fnode_update_children(params, node, tmp_res)&lt;br /&gt;
    fnode = (params[:reactParams][:nodeType]).constantize.new&lt;br /&gt;
    node.each do |a|&lt;br /&gt;
    fnode[a[0]] = a[1]&lt;br /&gt;
  end&lt;br /&gt;
    update_fnode_children(fnode, tmp_res)&lt;br /&gt;
    end&lt;br /&gt;
&lt;br /&gt;
  &lt;br /&gt;
  # for child nodes&lt;br /&gt;
  def children_node_ng&lt;br /&gt;
    child_nodes = child_nodes_from_params(params[:reactParams][:child_nodes])&lt;br /&gt;
    tmp_res = {}&lt;br /&gt;
    child_nodes.each do |node|&lt;br /&gt;
    initialize_fnode_update_children(params, node, tmp_res)&lt;br /&gt;
  end&lt;br /&gt;
    res = res_node_for_child(tmp_res)&lt;br /&gt;
    respond_to do |format|&lt;br /&gt;
    format.html { render json: res }&lt;br /&gt;
    end&lt;br /&gt;
    end&lt;/div&gt;</summary>
		<author><name>Krkulkar</name></author>
	</entry>
	<entry>
		<id>https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=112027</id>
		<title>CSC/ECE 517 Fall 2017/E17A8. Use a profiler to identify the problems / pages that take some time to load &amp; fix them</title>
		<link rel="alternate" type="text/html" href="https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=112027"/>
		<updated>2017-11-06T22:03:58Z</updated>

		<summary type="html">&lt;p&gt;Krkulkar: /* MiniProfiler Statistics */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;= Optimization for page loading in Expertiza =&lt;br /&gt;
&lt;br /&gt;
== Introduction ==&lt;br /&gt;
Expertiza is an online system that is used by students to view/submit assignments and review others' work. Expertiza also provides tools to visualize the scores and gauge the improvements made during the course semester. It also facilitates and monitors team projects. It is targeted at educational and non-profit organizations. The project is funded by the National Software Foundation (NSF), NCSU Learning in a Technology-Rich Environment (LITRE) program, the NCSU Faculty Center for Teaching and Learning, the NCSU STEM Initiative, and the Center for Advanced Computing and Communication.&lt;br /&gt;
&lt;br /&gt;
Expertiza is an open-source project with the source code available as a public repository on GitHub. It is developed using Ruby on Rails and is increasingly becoming robust thanks to the innumerable bugs being fixed by the community. The project has a micro-blog on SourceForge where the developer community report bugs and document updates.&lt;br /&gt;
&lt;br /&gt;
== Task Description ==&lt;br /&gt;
&lt;br /&gt;
1) Identifying the Expertiza pages which take time to load using Rack-mini-profiler and Flamegraphs. &lt;br /&gt;
2) Propose fixes which would improve the Expertiza project.&lt;br /&gt;
3) Optimizing the view, models and controllers for few of these corresponding fixes to improve the load time of these pages.&lt;br /&gt;
&lt;br /&gt;
== Gems Installed  ==&lt;br /&gt;
&lt;br /&gt;
*rack-mini-profiler :- Middleware that displays speed badge for every html page. Designed to work both in production and in development&lt;br /&gt;
*flamegraphs :- Flame graphs are a visualization of profiled software, allowing the most frequent code-paths to be identified quickly and accurately.&lt;br /&gt;
*stackprof:-A sampling call-stack profiler for ruby 2.1+.Downloaded as a dependency for rack-mini-profiler.&lt;br /&gt;
*fast_stack :-fast_stack is dynamically resizable data structure optimized for fast iteration over the large arrays of similar elements avoiding memory fragmentation.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
== Pages which needs to be optimized ==&lt;br /&gt;
&lt;br /&gt;
1)expertiza.ncsu.edu/tree_display/list&lt;br /&gt;
&lt;br /&gt;
2)expertiza.ncsu.edu/review_mapping/response_report&lt;br /&gt;
&lt;br /&gt;
3)expertiza.ncsu.edu/grades/view&lt;br /&gt;
&lt;br /&gt;
4)expertiza.ncsu.edu/users/list&lt;br /&gt;
&lt;br /&gt;
== Approach ==&lt;br /&gt;
In order to optimize, we need to understand the factors which are causing the lag. This can be identified by using the flamegraph generation method and rack-mini-profiler statistics. The statistics generated by rack miniprofiler help us to understand the time taken by each component to get loaded. From these statistics, we can identify the model/controller/view/database query which is causing this latency. From here, we can identify the methods which need to be refactored in order to optimize the webpage rendering.&lt;br /&gt;
&lt;br /&gt;
==Identification of pages ==&lt;br /&gt;
===Analysis of page 1: expertiza.ncsu.edu/tree_display/list ===&lt;br /&gt;
&lt;br /&gt;
===FlameGraph Statistics===&lt;br /&gt;
The following is the flamegraph for this page:-&lt;br /&gt;
[[File:f.png]]&lt;br /&gt;
&lt;br /&gt;
The X axis of the FlameGraph represents the time taken to load the page. It can give a clear picture of where the expertiza page is getting bogged down. The widest layers take the longest to run. They’re the areas one should look into, because speeding them up could have the biggest impact. As we can see over here, most of the time taken over here is in the controller action.&lt;br /&gt;
&lt;br /&gt;
===MiniProfiler Statistics===&lt;br /&gt;
The following is the rack-mini-profiler statistics for the page:-&lt;br /&gt;
[[File:tre1.png]]&lt;br /&gt;
&lt;br /&gt;
The box which is seen in the leftmost corner is the MiniProfiler statistics. MiniProfiler gives  a constant notification of how long each page takes to load. The miniprofiler statistics show the time taken to render the view as well as the corresponding SQL calls.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree2.png]]&lt;br /&gt;
&lt;br /&gt;
This image shows the time and the number of SQL calls which are required for each rendering.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree5.png]]&lt;br /&gt;
&lt;br /&gt;
Here as we can see the total number of SQL calls required for children_node_ng is 1123. This is causing the latency in the entire page by 10564.8 ms. These statistics helped us to identify the method which needs to be refactored.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree6.png]]&lt;br /&gt;
&lt;br /&gt;
The total number of SQL calls required for 2 components here is 2 each. Hence we do not need to refactor this component.&lt;br /&gt;
&lt;br /&gt;
===Identified Component causing the delay===&lt;br /&gt;
tree_display_controller&lt;br /&gt;
&lt;br /&gt;
The following methods are consuming most of the time in this code :-&lt;br /&gt;
&lt;br /&gt;
1)update_fnode_children&lt;br /&gt;
&lt;br /&gt;
2)initialize_fnode_update_children&lt;br /&gt;
&lt;br /&gt;
3)children_node_ng&lt;br /&gt;
&lt;br /&gt;
These methods are from line 172-201 in this controller.&lt;br /&gt;
&lt;br /&gt;
===Solution===&lt;br /&gt;
So here as we can see the time taken to load the page is high due to the time taken for the action :children_node_ng.The time taken to execute it is 10564.8 milliseconds.This is due to the 1123 SQL calls which are performed in the given action .This delay can be reduced by reducing the total number of SQL calls which can be basically reduced by identifying the methods causing this delay as well as by refactoring the code. The solution is to refactor the code which has been attached below to improve the time taken to perform this action.&lt;br /&gt;
&lt;br /&gt;
  def update_fnode_children(fnode, tmp_res)&lt;br /&gt;
    # fnode is short for foldernode which is the parent node&lt;br /&gt;
    # ch_nodes are childrens&lt;br /&gt;
    # cnode = fnode.get_children(&amp;quot;created_at&amp;quot;, &amp;quot;desc&amp;quot;, 2, nil, nil)&lt;br /&gt;
    ch_nodes = fnode.get_children(nil, nil, session[:user].id, nil, nil)&lt;br /&gt;
    tmp_res[fnode.get_name] = ch_nodes&lt;br /&gt;
  end&lt;br /&gt;
&lt;br /&gt;
 &lt;br /&gt;
  # initialize parent node and update child nodes for it&lt;br /&gt;
  def initialize_fnode_update_children(params, node, tmp_res)&lt;br /&gt;
    fnode = (params[:reactParams][:nodeType]).constantize.new&lt;br /&gt;
    node.each do |a|&lt;br /&gt;
    fnode[a[0]] = a[1]&lt;br /&gt;
  end&lt;br /&gt;
    update_fnode_children(fnode, tmp_res)&lt;br /&gt;
    end&lt;br /&gt;
&lt;br /&gt;
  &lt;br /&gt;
  # for child nodes&lt;br /&gt;
  def children_node_ng&lt;br /&gt;
    child_nodes = child_nodes_from_params(params[:reactParams][:child_nodes])&lt;br /&gt;
    tmp_res = {}&lt;br /&gt;
    child_nodes.each do |node|&lt;br /&gt;
    initialize_fnode_update_children(params, node, tmp_res)&lt;br /&gt;
  end&lt;br /&gt;
    res = res_node_for_child(tmp_res)&lt;br /&gt;
    respond_to do |format|&lt;br /&gt;
    format.html { render json: res }&lt;br /&gt;
    end&lt;br /&gt;
    end&lt;/div&gt;</summary>
		<author><name>Krkulkar</name></author>
	</entry>
	<entry>
		<id>https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=112025</id>
		<title>CSC/ECE 517 Fall 2017/E17A8. Use a profiler to identify the problems / pages that take some time to load &amp; fix them</title>
		<link rel="alternate" type="text/html" href="https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=112025"/>
		<updated>2017-11-06T22:02:57Z</updated>

		<summary type="html">&lt;p&gt;Krkulkar: /* FlameGraph Statistics */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;= Optimization for page loading in Expertiza =&lt;br /&gt;
&lt;br /&gt;
== Introduction ==&lt;br /&gt;
Expertiza is an online system that is used by students to view/submit assignments and review others' work. Expertiza also provides tools to visualize the scores and gauge the improvements made during the course semester. It also facilitates and monitors team projects. It is targeted at educational and non-profit organizations. The project is funded by the National Software Foundation (NSF), NCSU Learning in a Technology-Rich Environment (LITRE) program, the NCSU Faculty Center for Teaching and Learning, the NCSU STEM Initiative, and the Center for Advanced Computing and Communication.&lt;br /&gt;
&lt;br /&gt;
Expertiza is an open-source project with the source code available as a public repository on GitHub. It is developed using Ruby on Rails and is increasingly becoming robust thanks to the innumerable bugs being fixed by the community. The project has a micro-blog on SourceForge where the developer community report bugs and document updates.&lt;br /&gt;
&lt;br /&gt;
== Task Description ==&lt;br /&gt;
&lt;br /&gt;
1) Identifying the Expertiza pages which take time to load using Rack-mini-profiler and Flamegraphs. &lt;br /&gt;
2) Propose fixes which would improve the Expertiza project.&lt;br /&gt;
3) Optimizing the view, models and controllers for few of these corresponding fixes to improve the load time of these pages.&lt;br /&gt;
&lt;br /&gt;
== Gems Installed  ==&lt;br /&gt;
&lt;br /&gt;
*rack-mini-profiler :- Middleware that displays speed badge for every html page. Designed to work both in production and in development&lt;br /&gt;
*flamegraphs :- Flame graphs are a visualization of profiled software, allowing the most frequent code-paths to be identified quickly and accurately.&lt;br /&gt;
*stackprof:-A sampling call-stack profiler for ruby 2.1+.Downloaded as a dependency for rack-mini-profiler.&lt;br /&gt;
*fast_stack :-fast_stack is dynamically resizable data structure optimized for fast iteration over the large arrays of similar elements avoiding memory fragmentation.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
== Pages which needs to be optimized ==&lt;br /&gt;
&lt;br /&gt;
1)expertiza.ncsu.edu/tree_display/list&lt;br /&gt;
&lt;br /&gt;
2)expertiza.ncsu.edu/review_mapping/response_report&lt;br /&gt;
&lt;br /&gt;
3)expertiza.ncsu.edu/grades/view&lt;br /&gt;
&lt;br /&gt;
4)expertiza.ncsu.edu/users/list&lt;br /&gt;
&lt;br /&gt;
== Approach ==&lt;br /&gt;
In order to optimize, we need to understand the factors which are causing the lag. This can be identified by using the flamegraph generation method and rack-mini-profiler statistics. The statistics generated by rack miniprofiler help us to understand the time taken by each component to get loaded. From these statistics, we can identify the model/controller/view/database query which is causing this latency. From here, we can identify the methods which need to be refactored in order to optimize the webpage rendering.&lt;br /&gt;
&lt;br /&gt;
==Identification of pages ==&lt;br /&gt;
===Analysis of page 1: expertiza.ncsu.edu/tree_display/list ===&lt;br /&gt;
&lt;br /&gt;
===FlameGraph Statistics===&lt;br /&gt;
The following is the flamegraph for this page:-&lt;br /&gt;
[[File:f.png]]&lt;br /&gt;
&lt;br /&gt;
The X axis of the FlameGraph represents the time taken to load the page. It can give a clear picture of where the expertiza page is getting bogged down. The widest layers take the longest to run. They’re the areas one should look into, because speeding them up could have the biggest impact. As we can see over here, most of the time taken over here is in the controller action.&lt;br /&gt;
&lt;br /&gt;
===MiniProfiler Statistics===&lt;br /&gt;
The following is the rack-mini-profiler statistics for the page:-&lt;br /&gt;
[[File:tre1.png]]&lt;br /&gt;
&lt;br /&gt;
The box which is seen in the leftmost corner is the MiniProfiler statistics. MiniProfiler gives  a constant notification of how long each page takes to load.The miniprofiler statistics show the time taken to render the view as well as the corresponding SQL calls.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree2.png]]&lt;br /&gt;
&lt;br /&gt;
This image shows the time and the number of SQL calls which are required for each rendering.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree5.png]]&lt;br /&gt;
&lt;br /&gt;
Here as we can see the total number of SQL calls required for children_node_ng is 1123.This is causing the latency in the entire page by 10564.8 ms. This statistics helped us to identify the method which needs to be refactored.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree6.png]]&lt;br /&gt;
&lt;br /&gt;
The total number of SQL calls required for 2 components here is 2 each.Hence we do not need to refactor this component.&lt;br /&gt;
&lt;br /&gt;
===Identified Component causing the delay===&lt;br /&gt;
tree_display_controller&lt;br /&gt;
&lt;br /&gt;
The following methods are consuming most of the time in this code :-&lt;br /&gt;
&lt;br /&gt;
1)update_fnode_children&lt;br /&gt;
&lt;br /&gt;
2)initialize_fnode_update_children&lt;br /&gt;
&lt;br /&gt;
3)children_node_ng&lt;br /&gt;
&lt;br /&gt;
These methods are from line 172-201 in this controller.&lt;br /&gt;
&lt;br /&gt;
===Solution===&lt;br /&gt;
So here as we can see the time taken to load the page is high due to the time taken for the action :children_node_ng.The time taken to execute it is 10564.8 milliseconds.This is due to the 1123 SQL calls which are performed in the given action .This delay can be reduced by reducing the total number of SQL calls which can be basically reduced by identifying the methods causing this delay as well as by refactoring the code. The solution is to refactor the code which has been attached below to improve the time taken to perform this action.&lt;br /&gt;
&lt;br /&gt;
  def update_fnode_children(fnode, tmp_res)&lt;br /&gt;
    # fnode is short for foldernode which is the parent node&lt;br /&gt;
    # ch_nodes are childrens&lt;br /&gt;
    # cnode = fnode.get_children(&amp;quot;created_at&amp;quot;, &amp;quot;desc&amp;quot;, 2, nil, nil)&lt;br /&gt;
    ch_nodes = fnode.get_children(nil, nil, session[:user].id, nil, nil)&lt;br /&gt;
    tmp_res[fnode.get_name] = ch_nodes&lt;br /&gt;
  end&lt;br /&gt;
 &lt;br /&gt;
 # initialize parent node and update child nodes for it&lt;br /&gt;
  def initialize_fnode_update_children(params, node, tmp_res)&lt;br /&gt;
    fnode = (params[:reactParams][:nodeType]).constantize.new&lt;br /&gt;
    node.each do |a|&lt;br /&gt;
    fnode[a[0]] = a[1]&lt;br /&gt;
  end&lt;br /&gt;
    update_fnode_children(fnode, tmp_res)&lt;br /&gt;
    end&lt;br /&gt;
&lt;br /&gt;
  &lt;br /&gt;
  # for child nodes&lt;br /&gt;
  def children_node_ng&lt;br /&gt;
    child_nodes = child_nodes_from_params(params[:reactParams][:child_nodes])&lt;br /&gt;
    tmp_res = {}&lt;br /&gt;
    child_nodes.each do |node|&lt;br /&gt;
    initialize_fnode_update_children(params, node, tmp_res)&lt;br /&gt;
  end&lt;br /&gt;
    res = res_node_for_child(tmp_res)&lt;br /&gt;
    respond_to do |format|&lt;br /&gt;
    format.html { render json: res }&lt;br /&gt;
    end&lt;br /&gt;
    end&lt;/div&gt;</summary>
		<author><name>Krkulkar</name></author>
	</entry>
	<entry>
		<id>https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=112023</id>
		<title>CSC/ECE 517 Fall 2017/E17A8. Use a profiler to identify the problems / pages that take some time to load &amp; fix them</title>
		<link rel="alternate" type="text/html" href="https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=112023"/>
		<updated>2017-11-06T22:02:33Z</updated>

		<summary type="html">&lt;p&gt;Krkulkar: /* FlameGraph Statistics */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;= Optimization for page loading in Expertiza =&lt;br /&gt;
&lt;br /&gt;
== Introduction ==&lt;br /&gt;
Expertiza is an online system that is used by students to view/submit assignments and review others' work. Expertiza also provides tools to visualize the scores and gauge the improvements made during the course semester. It also facilitates and monitors team projects. It is targeted at educational and non-profit organizations. The project is funded by the National Software Foundation (NSF), NCSU Learning in a Technology-Rich Environment (LITRE) program, the NCSU Faculty Center for Teaching and Learning, the NCSU STEM Initiative, and the Center for Advanced Computing and Communication.&lt;br /&gt;
&lt;br /&gt;
Expertiza is an open-source project with the source code available as a public repository on GitHub. It is developed using Ruby on Rails and is increasingly becoming robust thanks to the innumerable bugs being fixed by the community. The project has a micro-blog on SourceForge where the developer community report bugs and document updates.&lt;br /&gt;
&lt;br /&gt;
== Task Description ==&lt;br /&gt;
&lt;br /&gt;
1) Identifying the Expertiza pages which take time to load using Rack-mini-profiler and Flamegraphs. &lt;br /&gt;
2) Propose fixes which would improve the Expertiza project.&lt;br /&gt;
3) Optimizing the view, models and controllers for few of these corresponding fixes to improve the load time of these pages.&lt;br /&gt;
&lt;br /&gt;
== Gems Installed  ==&lt;br /&gt;
&lt;br /&gt;
*rack-mini-profiler :- Middleware that displays speed badge for every html page. Designed to work both in production and in development&lt;br /&gt;
*flamegraphs :- Flame graphs are a visualization of profiled software, allowing the most frequent code-paths to be identified quickly and accurately.&lt;br /&gt;
*stackprof:-A sampling call-stack profiler for ruby 2.1+.Downloaded as a dependency for rack-mini-profiler.&lt;br /&gt;
*fast_stack :-fast_stack is dynamically resizable data structure optimized for fast iteration over the large arrays of similar elements avoiding memory fragmentation.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
== Pages which needs to be optimized ==&lt;br /&gt;
&lt;br /&gt;
1)expertiza.ncsu.edu/tree_display/list&lt;br /&gt;
&lt;br /&gt;
2)expertiza.ncsu.edu/review_mapping/response_report&lt;br /&gt;
&lt;br /&gt;
3)expertiza.ncsu.edu/grades/view&lt;br /&gt;
&lt;br /&gt;
4)expertiza.ncsu.edu/users/list&lt;br /&gt;
&lt;br /&gt;
== Approach ==&lt;br /&gt;
In order to optimize, we need to understand the factors which are causing the lag. This can be identified by using the flamegraph generation method and rack-mini-profiler statistics. The statistics generated by rack miniprofiler help us to understand the time taken by each component to get loaded. From these statistics, we can identify the model/controller/view/database query which is causing this latency. From here, we can identify the methods which need to be refactored in order to optimize the webpage rendering.&lt;br /&gt;
&lt;br /&gt;
==Identification of pages ==&lt;br /&gt;
===Analysis of page 1: expertiza.ncsu.edu/tree_display/list ===&lt;br /&gt;
&lt;br /&gt;
===FlameGraph Statistics===&lt;br /&gt;
The following is the flamegraph for this page:-&lt;br /&gt;
[[File:f.png]]&lt;br /&gt;
&lt;br /&gt;
The X axis of the FlameGraph represents the time taken to load the page. It can give a clear picture of where the expertiza page is getting bogged down. The widest layers take the longest to run. They’re the areas one should look into, because speeding them up could have the biggest impact. As we can see over here, the most time taken over here is in the controller action.&lt;br /&gt;
&lt;br /&gt;
===MiniProfiler Statistics===&lt;br /&gt;
The following is the rack-mini-profiler statistics for the page:-&lt;br /&gt;
[[File:tre1.png]]&lt;br /&gt;
&lt;br /&gt;
The box which is seen in the leftmost corner is the MiniProfiler statistics. MiniProfiler gives  a constant notification of how long each page takes to load.The miniprofiler statistics show the time taken to render the view as well as the corresponding SQL calls.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree2.png]]&lt;br /&gt;
&lt;br /&gt;
This image shows the time and the number of SQL calls which are required for each rendering.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree5.png]]&lt;br /&gt;
&lt;br /&gt;
Here as we can see the total number of SQL calls required for children_node_ng is 1123.This is causing the latency in the entire page by 10564.8 ms. This statistics helped us to identify the method which needs to be refactored.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree6.png]]&lt;br /&gt;
&lt;br /&gt;
The total number of SQL calls required for 2 components here is 2 each.Hence we do not need to refactor this component.&lt;br /&gt;
&lt;br /&gt;
===Identified Component causing the delay===&lt;br /&gt;
tree_display_controller&lt;br /&gt;
&lt;br /&gt;
The following methods are consuming most of the time in this code :-&lt;br /&gt;
&lt;br /&gt;
1)update_fnode_children&lt;br /&gt;
&lt;br /&gt;
2)initialize_fnode_update_children&lt;br /&gt;
&lt;br /&gt;
3)children_node_ng&lt;br /&gt;
&lt;br /&gt;
These methods are from line 172-201 in this controller.&lt;br /&gt;
&lt;br /&gt;
===Solution===&lt;br /&gt;
So here as we can see the time taken to load the page is high due to the time taken for the action :children_node_ng.The time taken to execute it is 10564.8 milliseconds.This is due to the 1123 SQL calls which are performed in the given action .This delay can be reduced by reducing the total number of SQL calls which can be basically reduced by identifying the methods causing this delay as well as by refactoring the code. The solution is to refactor the code which has been attached below to improve the time taken to perform this action.&lt;br /&gt;
&lt;br /&gt;
  def update_fnode_children(fnode, tmp_res)&lt;br /&gt;
    # fnode is short for foldernode which is the parent node&lt;br /&gt;
    # ch_nodes are childrens&lt;br /&gt;
    # cnode = fnode.get_children(&amp;quot;created_at&amp;quot;, &amp;quot;desc&amp;quot;, 2, nil, nil)&lt;br /&gt;
    ch_nodes = fnode.get_children(nil, nil, session[:user].id, nil, nil)&lt;br /&gt;
    tmp_res[fnode.get_name] = ch_nodes&lt;br /&gt;
  end&lt;br /&gt;
  # initialize parent node and update child nodes for it&lt;br /&gt;
  def initialize_fnode_update_children(params, node, tmp_res)&lt;br /&gt;
    fnode = (params[:reactParams][:nodeType]).constantize.new&lt;br /&gt;
    node.each do |a|&lt;br /&gt;
    fnode[a[0]] = a[1]&lt;br /&gt;
  end&lt;br /&gt;
    update_fnode_children(fnode, tmp_res)&lt;br /&gt;
    end&lt;br /&gt;
&lt;br /&gt;
  &lt;br /&gt;
  # for child nodes&lt;br /&gt;
  def children_node_ng&lt;br /&gt;
    child_nodes = child_nodes_from_params(params[:reactParams][:child_nodes])&lt;br /&gt;
    tmp_res = {}&lt;br /&gt;
    child_nodes.each do |node|&lt;br /&gt;
    initialize_fnode_update_children(params, node, tmp_res)&lt;br /&gt;
  end&lt;br /&gt;
    res = res_node_for_child(tmp_res)&lt;br /&gt;
    respond_to do |format|&lt;br /&gt;
    format.html { render json: res }&lt;br /&gt;
    end&lt;br /&gt;
    end&lt;/div&gt;</summary>
		<author><name>Krkulkar</name></author>
	</entry>
	<entry>
		<id>https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=112021</id>
		<title>CSC/ECE 517 Fall 2017/E17A8. Use a profiler to identify the problems / pages that take some time to load &amp; fix them</title>
		<link rel="alternate" type="text/html" href="https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=112021"/>
		<updated>2017-11-06T22:01:44Z</updated>

		<summary type="html">&lt;p&gt;Krkulkar: /* Analysis of page1 */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;= Optimization for page loading in Expertiza =&lt;br /&gt;
&lt;br /&gt;
== Introduction ==&lt;br /&gt;
Expertiza is an online system that is used by students to view/submit assignments and review others' work. Expertiza also provides tools to visualize the scores and gauge the improvements made during the course semester. It also facilitates and monitors team projects. It is targeted at educational and non-profit organizations. The project is funded by the National Software Foundation (NSF), NCSU Learning in a Technology-Rich Environment (LITRE) program, the NCSU Faculty Center for Teaching and Learning, the NCSU STEM Initiative, and the Center for Advanced Computing and Communication.&lt;br /&gt;
&lt;br /&gt;
Expertiza is an open-source project with the source code available as a public repository on GitHub. It is developed using Ruby on Rails and is increasingly becoming robust thanks to the innumerable bugs being fixed by the community. The project has a micro-blog on SourceForge where the developer community report bugs and document updates.&lt;br /&gt;
&lt;br /&gt;
== Task Description ==&lt;br /&gt;
&lt;br /&gt;
1) Identifying the Expertiza pages which take time to load using Rack-mini-profiler and Flamegraphs. &lt;br /&gt;
2) Propose fixes which would improve the Expertiza project.&lt;br /&gt;
3) Optimizing the view, models and controllers for few of these corresponding fixes to improve the load time of these pages.&lt;br /&gt;
&lt;br /&gt;
== Gems Installed  ==&lt;br /&gt;
&lt;br /&gt;
*rack-mini-profiler :- Middleware that displays speed badge for every html page. Designed to work both in production and in development&lt;br /&gt;
*flamegraphs :- Flame graphs are a visualization of profiled software, allowing the most frequent code-paths to be identified quickly and accurately.&lt;br /&gt;
*stackprof:-A sampling call-stack profiler for ruby 2.1+.Downloaded as a dependency for rack-mini-profiler.&lt;br /&gt;
*fast_stack :-fast_stack is dynamically resizable data structure optimized for fast iteration over the large arrays of similar elements avoiding memory fragmentation.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
== Pages which needs to be optimized ==&lt;br /&gt;
&lt;br /&gt;
1)expertiza.ncsu.edu/tree_display/list&lt;br /&gt;
&lt;br /&gt;
2)expertiza.ncsu.edu/review_mapping/response_report&lt;br /&gt;
&lt;br /&gt;
3)expertiza.ncsu.edu/grades/view&lt;br /&gt;
&lt;br /&gt;
4)expertiza.ncsu.edu/users/list&lt;br /&gt;
&lt;br /&gt;
== Approach ==&lt;br /&gt;
In order to optimize, we need to understand the factors which are causing the lag. This can be identified by using the flamegraph generation method and rack-mini-profiler statistics. The statistics generated by rack miniprofiler help us to understand the time taken by each component to get loaded. From these statistics, we can identify the model/controller/view/database query which is causing this latency. From here, we can identify the methods which need to be refactored in order to optimize the webpage rendering.&lt;br /&gt;
&lt;br /&gt;
==Identification of pages ==&lt;br /&gt;
===Analysis of page 1: expertiza.ncsu.edu/tree_display/list ===&lt;br /&gt;
&lt;br /&gt;
===FlameGraph Statistics===&lt;br /&gt;
The following is the flamegraph for this page:-&lt;br /&gt;
[[File:f.png]]&lt;br /&gt;
&lt;br /&gt;
The X axis of the FlameGraph represents the time taken to load the page.It can give a clear picture of where the expertiza page is getting bogged down. The widest layers take the longest to run. They’re the  areas one should look into, because speeding them up could have the biggest impact. As we can see over here the most time taken over here is in the controller action.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
===MiniProfiler Statistics===&lt;br /&gt;
The following is the rack-mini-profiler statistics for the page:-&lt;br /&gt;
[[File:tre1.png]]&lt;br /&gt;
&lt;br /&gt;
The box which is seen in the leftmost corner is the MiniProfiler statistics. MiniProfiler gives  a constant notification of how long each page takes to load.The miniprofiler statistics show the time taken to render the view as well as the corresponding SQL calls.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree2.png]]&lt;br /&gt;
&lt;br /&gt;
This image shows the time and the number of SQL calls which are required for each rendering.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree5.png]]&lt;br /&gt;
&lt;br /&gt;
Here as we can see the total number of SQL calls required for children_node_ng is 1123.This is causing the latency in the entire page by 10564.8 ms. This statistics helped us to identify the method which needs to be refactored.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree6.png]]&lt;br /&gt;
&lt;br /&gt;
The total number of SQL calls required for 2 components here is 2 each.Hence we do not need to refactor this component.&lt;br /&gt;
&lt;br /&gt;
===Identified Component causing the delay===&lt;br /&gt;
tree_display_controller&lt;br /&gt;
&lt;br /&gt;
The following methods are consuming most of the time in this code :-&lt;br /&gt;
&lt;br /&gt;
1)update_fnode_children&lt;br /&gt;
&lt;br /&gt;
2)initialize_fnode_update_children&lt;br /&gt;
&lt;br /&gt;
3)children_node_ng&lt;br /&gt;
&lt;br /&gt;
These methods are from line 172-201 in this controller.&lt;br /&gt;
&lt;br /&gt;
===Solution===&lt;br /&gt;
So here as we can see the time taken to load the page is high due to the time taken for the action :children_node_ng.The time taken to execute it is 10564.8 milliseconds.This is due to the 1123 SQL calls which are performed in the given action .This delay can be reduced by reducing the total number of SQL calls which can be basically reduced by identifying the methods causing this delay as well as by refactoring the code. The solution is to refactor the code which has been attached below to improve the time taken to perform this action.&lt;br /&gt;
&lt;br /&gt;
  def update_fnode_children(fnode, tmp_res)&lt;br /&gt;
    # fnode is short for foldernode which is the parent node&lt;br /&gt;
    # ch_nodes are childrens&lt;br /&gt;
    # cnode = fnode.get_children(&amp;quot;created_at&amp;quot;, &amp;quot;desc&amp;quot;, 2, nil, nil)&lt;br /&gt;
    ch_nodes = fnode.get_children(nil, nil, session[:user].id, nil, nil)&lt;br /&gt;
    tmp_res[fnode.get_name] = ch_nodes&lt;br /&gt;
  end&lt;br /&gt;
&lt;br /&gt;
    # initialize parent node and update child nodes for it&lt;br /&gt;
    def initialize_fnode_update_children(params, node, tmp_res)&lt;br /&gt;
      fnode = (params[:reactParams][:nodeType]).constantize.new&lt;br /&gt;
      node.each do |a|&lt;br /&gt;
        fnode[a[0]] = a[1]&lt;br /&gt;
      end&lt;br /&gt;
      update_fnode_children(fnode, tmp_res)&lt;br /&gt;
    end&lt;br /&gt;
&lt;br /&gt;
    # for child nodes&lt;br /&gt;
    def children_node_ng&lt;br /&gt;
      child_nodes = child_nodes_from_params(params[:reactParams][:child_nodes])&lt;br /&gt;
      tmp_res = {}&lt;br /&gt;
      child_nodes.each do |node|&lt;br /&gt;
        initialize_fnode_update_children(params, node, tmp_res)&lt;br /&gt;
      end&lt;br /&gt;
      res = res_node_for_child(tmp_res)&lt;br /&gt;
      respond_to do |format|&lt;br /&gt;
        format.html { render json: res }&lt;br /&gt;
      end&lt;br /&gt;
    end&lt;/div&gt;</summary>
		<author><name>Krkulkar</name></author>
	</entry>
	<entry>
		<id>https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=112020</id>
		<title>CSC/ECE 517 Fall 2017/E17A8. Use a profiler to identify the problems / pages that take some time to load &amp; fix them</title>
		<link rel="alternate" type="text/html" href="https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=112020"/>
		<updated>2017-11-06T22:01:05Z</updated>

		<summary type="html">&lt;p&gt;Krkulkar: /* Approach */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;= Optimization for page loading in Expertiza =&lt;br /&gt;
&lt;br /&gt;
== Introduction ==&lt;br /&gt;
Expertiza is an online system that is used by students to view/submit assignments and review others' work. Expertiza also provides tools to visualize the scores and gauge the improvements made during the course semester. It also facilitates and monitors team projects. It is targeted at educational and non-profit organizations. The project is funded by the National Software Foundation (NSF), NCSU Learning in a Technology-Rich Environment (LITRE) program, the NCSU Faculty Center for Teaching and Learning, the NCSU STEM Initiative, and the Center for Advanced Computing and Communication.&lt;br /&gt;
&lt;br /&gt;
Expertiza is an open-source project with the source code available as a public repository on GitHub. It is developed using Ruby on Rails and is increasingly becoming robust thanks to the innumerable bugs being fixed by the community. The project has a micro-blog on SourceForge where the developer community report bugs and document updates.&lt;br /&gt;
&lt;br /&gt;
== Task Description ==&lt;br /&gt;
&lt;br /&gt;
1) Identifying the Expertiza pages which take time to load using Rack-mini-profiler and Flamegraphs. &lt;br /&gt;
2) Propose fixes which would improve the Expertiza project.&lt;br /&gt;
3) Optimizing the view, models and controllers for few of these corresponding fixes to improve the load time of these pages.&lt;br /&gt;
&lt;br /&gt;
== Gems Installed  ==&lt;br /&gt;
&lt;br /&gt;
*rack-mini-profiler :- Middleware that displays speed badge for every html page. Designed to work both in production and in development&lt;br /&gt;
*flamegraphs :- Flame graphs are a visualization of profiled software, allowing the most frequent code-paths to be identified quickly and accurately.&lt;br /&gt;
*stackprof:-A sampling call-stack profiler for ruby 2.1+.Downloaded as a dependency for rack-mini-profiler.&lt;br /&gt;
*fast_stack :-fast_stack is dynamically resizable data structure optimized for fast iteration over the large arrays of similar elements avoiding memory fragmentation.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
== Pages which needs to be optimized ==&lt;br /&gt;
&lt;br /&gt;
1)expertiza.ncsu.edu/tree_display/list&lt;br /&gt;
&lt;br /&gt;
2)expertiza.ncsu.edu/review_mapping/response_report&lt;br /&gt;
&lt;br /&gt;
3)expertiza.ncsu.edu/grades/view&lt;br /&gt;
&lt;br /&gt;
4)expertiza.ncsu.edu/users/list&lt;br /&gt;
&lt;br /&gt;
== Approach ==&lt;br /&gt;
In order to optimize, we need to understand the factors which are causing the lag. This can be identified by using the flamegraph generation method and rack-mini-profiler statistics. The statistics generated by rack miniprofiler help us to understand the time taken by each component to get loaded. From these statistics, we can identify the model/controller/view/database query which is causing this latency. From here, we can identify the methods which need to be refactored in order to optimize the webpage rendering.&lt;br /&gt;
&lt;br /&gt;
==Identification of pages ==&lt;br /&gt;
===Analysis of page1 ===&lt;br /&gt;
===FlameGraph Statistics===&lt;br /&gt;
The following is the flamegraph for this page:-&lt;br /&gt;
[[File:f.png]]&lt;br /&gt;
&lt;br /&gt;
The X axis of the FlameGraph represents the time taken to load the page.It can give a clear picture of where the expertiza page is getting bogged down. The widest layers take the longest to run. They’re the  areas one should look into, because speeding them up could have the biggest impact. As we can see over here the most time taken over here is in the controller action.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
===MiniProfiler Statistics===&lt;br /&gt;
The following is the rack-mini-profiler statistics for the page:-&lt;br /&gt;
[[File:tre1.png]]&lt;br /&gt;
&lt;br /&gt;
The box which is seen in the leftmost corner is the MiniProfiler statistics. MiniProfiler gives  a constant notification of how long each page takes to load.The miniprofiler statistics show the time taken to render the view as well as the corresponding SQL calls.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree2.png]]&lt;br /&gt;
&lt;br /&gt;
This image shows the time and the number of SQL calls which are required for each rendering.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree5.png]]&lt;br /&gt;
&lt;br /&gt;
Here as we can see the total number of SQL calls required for children_node_ng is 1123.This is causing the latency in the entire page by 10564.8 ms. This statistics helped us to identify the method which needs to be refactored.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree6.png]]&lt;br /&gt;
&lt;br /&gt;
The total number of SQL calls required for 2 components here is 2 each.Hence we do not need to refactor this component.&lt;br /&gt;
&lt;br /&gt;
===Identified Component causing the delay===&lt;br /&gt;
tree_display_controller&lt;br /&gt;
&lt;br /&gt;
The following methods are consuming most of the time in this code :-&lt;br /&gt;
&lt;br /&gt;
1)update_fnode_children&lt;br /&gt;
&lt;br /&gt;
2)initialize_fnode_update_children&lt;br /&gt;
&lt;br /&gt;
3)children_node_ng&lt;br /&gt;
&lt;br /&gt;
These methods are from line 172-201 in this controller.&lt;br /&gt;
&lt;br /&gt;
===Solution===&lt;br /&gt;
So here as we can see the time taken to load the page is high due to the time taken for the action :children_node_ng.The time taken to execute it is 10564.8 milliseconds.This is due to the 1123 SQL calls which are performed in the given action .This delay can be reduced by reducing the total number of SQL calls which can be basically reduced by identifying the methods causing this delay as well as by refactoring the code. The solution is to refactor the code which has been attached below to improve the time taken to perform this action.&lt;br /&gt;
&lt;br /&gt;
  def update_fnode_children(fnode, tmp_res)&lt;br /&gt;
    # fnode is short for foldernode which is the parent node&lt;br /&gt;
    # ch_nodes are childrens&lt;br /&gt;
    # cnode = fnode.get_children(&amp;quot;created_at&amp;quot;, &amp;quot;desc&amp;quot;, 2, nil, nil)&lt;br /&gt;
    ch_nodes = fnode.get_children(nil, nil, session[:user].id, nil, nil)&lt;br /&gt;
    tmp_res[fnode.get_name] = ch_nodes&lt;br /&gt;
  end&lt;br /&gt;
&lt;br /&gt;
    # initialize parent node and update child nodes for it&lt;br /&gt;
    def initialize_fnode_update_children(params, node, tmp_res)&lt;br /&gt;
      fnode = (params[:reactParams][:nodeType]).constantize.new&lt;br /&gt;
      node.each do |a|&lt;br /&gt;
        fnode[a[0]] = a[1]&lt;br /&gt;
      end&lt;br /&gt;
      update_fnode_children(fnode, tmp_res)&lt;br /&gt;
    end&lt;br /&gt;
&lt;br /&gt;
    # for child nodes&lt;br /&gt;
    def children_node_ng&lt;br /&gt;
      child_nodes = child_nodes_from_params(params[:reactParams][:child_nodes])&lt;br /&gt;
      tmp_res = {}&lt;br /&gt;
      child_nodes.each do |node|&lt;br /&gt;
        initialize_fnode_update_children(params, node, tmp_res)&lt;br /&gt;
      end&lt;br /&gt;
      res = res_node_for_child(tmp_res)&lt;br /&gt;
      respond_to do |format|&lt;br /&gt;
        format.html { render json: res }&lt;br /&gt;
      end&lt;br /&gt;
    end&lt;/div&gt;</summary>
		<author><name>Krkulkar</name></author>
	</entry>
	<entry>
		<id>https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=112019</id>
		<title>CSC/ECE 517 Fall 2017/E17A8. Use a profiler to identify the problems / pages that take some time to load &amp; fix them</title>
		<link rel="alternate" type="text/html" href="https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=112019"/>
		<updated>2017-11-06T22:00:09Z</updated>

		<summary type="html">&lt;p&gt;Krkulkar: /* Approach */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;= Optimization for page loading in Expertiza =&lt;br /&gt;
&lt;br /&gt;
== Introduction ==&lt;br /&gt;
Expertiza is an online system that is used by students to view/submit assignments and review others' work. Expertiza also provides tools to visualize the scores and gauge the improvements made during the course semester. It also facilitates and monitors team projects. It is targeted at educational and non-profit organizations. The project is funded by the National Software Foundation (NSF), NCSU Learning in a Technology-Rich Environment (LITRE) program, the NCSU Faculty Center for Teaching and Learning, the NCSU STEM Initiative, and the Center for Advanced Computing and Communication.&lt;br /&gt;
&lt;br /&gt;
Expertiza is an open-source project with the source code available as a public repository on GitHub. It is developed using Ruby on Rails and is increasingly becoming robust thanks to the innumerable bugs being fixed by the community. The project has a micro-blog on SourceForge where the developer community report bugs and document updates.&lt;br /&gt;
&lt;br /&gt;
== Task Description ==&lt;br /&gt;
&lt;br /&gt;
1) Identifying the Expertiza pages which take time to load using Rack-mini-profiler and Flamegraphs. &lt;br /&gt;
2) Propose fixes which would improve the Expertiza project.&lt;br /&gt;
3) Optimizing the view, models and controllers for few of these corresponding fixes to improve the load time of these pages.&lt;br /&gt;
&lt;br /&gt;
== Gems Installed  ==&lt;br /&gt;
&lt;br /&gt;
*rack-mini-profiler :- Middleware that displays speed badge for every html page. Designed to work both in production and in development&lt;br /&gt;
*flamegraphs :- Flame graphs are a visualization of profiled software, allowing the most frequent code-paths to be identified quickly and accurately.&lt;br /&gt;
*stackprof:-A sampling call-stack profiler for ruby 2.1+.Downloaded as a dependency for rack-mini-profiler.&lt;br /&gt;
*fast_stack :-fast_stack is dynamically resizable data structure optimized for fast iteration over the large arrays of similar elements avoiding memory fragmentation.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
== Pages which needs to be optimized ==&lt;br /&gt;
&lt;br /&gt;
1)expertiza.ncsu.edu/tree_display/list&lt;br /&gt;
&lt;br /&gt;
2)expertiza.ncsu.edu/review_mapping/response_report&lt;br /&gt;
&lt;br /&gt;
3)expertiza.ncsu.edu/grades/view&lt;br /&gt;
&lt;br /&gt;
4)expertiza.ncsu.edu/users/list&lt;br /&gt;
&lt;br /&gt;
== Approach ==&lt;br /&gt;
In order to optimize, we need to understand the factors which are causing the lag. It can be basically identified by using the flamegraph generation and rack-mini-profiler statistics. The statistics generated by rack miniprofiler helps us to understand the time taken by each component to get loaded. From these statistic we can identify the model/controller/view/database query which is causing this latency. From here we can identify the methods which needs to be refactored in order to optimize the webpage rendering.&lt;br /&gt;
&lt;br /&gt;
==Identification of pages ==&lt;br /&gt;
===Analysis of page1 ===&lt;br /&gt;
===FlameGraph Statistics===&lt;br /&gt;
The following is the flamegraph for this page:-&lt;br /&gt;
[[File:f.png]]&lt;br /&gt;
&lt;br /&gt;
The X axis of the FlameGraph represents the time taken to load the page.It can give a clear picture of where the expertiza page is getting bogged down. The widest layers take the longest to run. They’re the  areas one should look into, because speeding them up could have the biggest impact. As we can see over here the most time taken over here is in the controller action.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
===MiniProfiler Statistics===&lt;br /&gt;
The following is the rack-mini-profiler statistics for the page:-&lt;br /&gt;
[[File:tre1.png]]&lt;br /&gt;
&lt;br /&gt;
The box which is seen in the leftmost corner is the MiniProfiler statistics. MiniProfiler gives  a constant notification of how long each page takes to load.The miniprofiler statistics show the time taken to render the view as well as the corresponding SQL calls.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree2.png]]&lt;br /&gt;
&lt;br /&gt;
This image shows the time and the number of SQL calls which are required for each rendering.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree5.png]]&lt;br /&gt;
&lt;br /&gt;
Here as we can see the total number of SQL calls required for children_node_ng is 1123.This is causing the latency in the entire page by 10564.8 ms. This statistics helped us to identify the method which needs to be refactored.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree6.png]]&lt;br /&gt;
&lt;br /&gt;
The total number of SQL calls required for 2 components here is 2 each.Hence we do not need to refactor this component.&lt;br /&gt;
&lt;br /&gt;
===Identified Component causing the delay===&lt;br /&gt;
tree_display_controller&lt;br /&gt;
&lt;br /&gt;
The following methods are consuming most of the time in this code :-&lt;br /&gt;
&lt;br /&gt;
1)update_fnode_children&lt;br /&gt;
&lt;br /&gt;
2)initialize_fnode_update_children&lt;br /&gt;
&lt;br /&gt;
3)children_node_ng&lt;br /&gt;
&lt;br /&gt;
These methods are from line 172-201 in this controller.&lt;br /&gt;
&lt;br /&gt;
===Solution===&lt;br /&gt;
So here as we can see the time taken to load the page is high due to the time taken for the action :children_node_ng.The time taken to execute it is 10564.8 milliseconds.This is due to the 1123 SQL calls which are performed in the given action .This delay can be reduced by reducing the total number of SQL calls which can be basically reduced by identifying the methods causing this delay as well as by refactoring the code. The solution is to refactor the code which has been attached below to improve the time taken to perform this action.&lt;br /&gt;
&lt;br /&gt;
  def update_fnode_children(fnode, tmp_res)&lt;br /&gt;
    # fnode is short for foldernode which is the parent node&lt;br /&gt;
    # ch_nodes are childrens&lt;br /&gt;
    # cnode = fnode.get_children(&amp;quot;created_at&amp;quot;, &amp;quot;desc&amp;quot;, 2, nil, nil)&lt;br /&gt;
    ch_nodes = fnode.get_children(nil, nil, session[:user].id, nil, nil)&lt;br /&gt;
    tmp_res[fnode.get_name] = ch_nodes&lt;br /&gt;
  end&lt;br /&gt;
&lt;br /&gt;
    # initialize parent node and update child nodes for it&lt;br /&gt;
    def initialize_fnode_update_children(params, node, tmp_res)&lt;br /&gt;
      fnode = (params[:reactParams][:nodeType]).constantize.new&lt;br /&gt;
      node.each do |a|&lt;br /&gt;
        fnode[a[0]] = a[1]&lt;br /&gt;
      end&lt;br /&gt;
      update_fnode_children(fnode, tmp_res)&lt;br /&gt;
    end&lt;br /&gt;
&lt;br /&gt;
    # for child nodes&lt;br /&gt;
    def children_node_ng&lt;br /&gt;
      child_nodes = child_nodes_from_params(params[:reactParams][:child_nodes])&lt;br /&gt;
      tmp_res = {}&lt;br /&gt;
      child_nodes.each do |node|&lt;br /&gt;
        initialize_fnode_update_children(params, node, tmp_res)&lt;br /&gt;
      end&lt;br /&gt;
      res = res_node_for_child(tmp_res)&lt;br /&gt;
      respond_to do |format|&lt;br /&gt;
        format.html { render json: res }&lt;br /&gt;
      end&lt;br /&gt;
    end&lt;/div&gt;</summary>
		<author><name>Krkulkar</name></author>
	</entry>
	<entry>
		<id>https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=112017</id>
		<title>CSC/ECE 517 Fall 2017/E17A8. Use a profiler to identify the problems / pages that take some time to load &amp; fix them</title>
		<link rel="alternate" type="text/html" href="https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E17A8._Use_a_profiler_to_identify_the_problems_/_pages_that_take_some_time_to_load_%26_fix_them&amp;diff=112017"/>
		<updated>2017-11-06T21:59:15Z</updated>

		<summary type="html">&lt;p&gt;Krkulkar: /* Task Description */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;= Optimization for page loading in Expertiza =&lt;br /&gt;
&lt;br /&gt;
== Introduction ==&lt;br /&gt;
Expertiza is an online system that is used by students to view/submit assignments and review others' work. Expertiza also provides tools to visualize the scores and gauge the improvements made during the course semester. It also facilitates and monitors team projects. It is targeted at educational and non-profit organizations. The project is funded by the National Software Foundation (NSF), NCSU Learning in a Technology-Rich Environment (LITRE) program, the NCSU Faculty Center for Teaching and Learning, the NCSU STEM Initiative, and the Center for Advanced Computing and Communication.&lt;br /&gt;
&lt;br /&gt;
Expertiza is an open-source project with the source code available as a public repository on GitHub. It is developed using Ruby on Rails and is increasingly becoming robust thanks to the innumerable bugs being fixed by the community. The project has a micro-blog on SourceForge where the developer community report bugs and document updates.&lt;br /&gt;
&lt;br /&gt;
== Task Description ==&lt;br /&gt;
&lt;br /&gt;
1) Identifying the Expertiza pages which take time to load using Rack-mini-profiler and Flamegraphs. &lt;br /&gt;
2) Propose fixes which would improve the Expertiza project.&lt;br /&gt;
3) Optimizing the view, models and controllers for few of these corresponding fixes to improve the load time of these pages.&lt;br /&gt;
&lt;br /&gt;
== Gems Installed  ==&lt;br /&gt;
&lt;br /&gt;
*rack-mini-profiler :- Middleware that displays speed badge for every html page. Designed to work both in production and in development&lt;br /&gt;
*flamegraphs :- Flame graphs are a visualization of profiled software, allowing the most frequent code-paths to be identified quickly and accurately.&lt;br /&gt;
*stackprof:-A sampling call-stack profiler for ruby 2.1+.Downloaded as a dependency for rack-mini-profiler.&lt;br /&gt;
*fast_stack :-fast_stack is dynamically resizable data structure optimized for fast iteration over the large arrays of similar elements avoiding memory fragmentation.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
== Pages which needs to be optimized ==&lt;br /&gt;
&lt;br /&gt;
1)expertiza.ncsu.edu/tree_display/list&lt;br /&gt;
&lt;br /&gt;
2)expertiza.ncsu.edu/review_mapping/response_report&lt;br /&gt;
&lt;br /&gt;
3)expertiza.ncsu.edu/grades/view&lt;br /&gt;
&lt;br /&gt;
4)expertiza.ncsu.edu/users/list&lt;br /&gt;
&lt;br /&gt;
== Approach ==&lt;br /&gt;
In order to optimize we need to understand the factors which is causing the lag , it can be basically identified by using the flamegraph generation and rack-mini-profiler statistics. The statistics generated by rack miniprofiler helps us to understand the time taken by each component to get loaded. From these statistic we can identify the model/controller/view/database query which is causing this latency. From here we can identify the methods which needs to be refactored in order to optimize the webpage rendering.&lt;br /&gt;
&lt;br /&gt;
==Identification of pages ==&lt;br /&gt;
===Analysis of page1 ===&lt;br /&gt;
===FlameGraph Statistics===&lt;br /&gt;
The following is the flamegraph for this page:-&lt;br /&gt;
[[File:f.png]]&lt;br /&gt;
&lt;br /&gt;
The X axis of the FlameGraph represents the time taken to load the page.It can give a clear picture of where the expertiza page is getting bogged down. The widest layers take the longest to run. They’re the  areas one should look into, because speeding them up could have the biggest impact. As we can see over here the most time taken over here is in the controller action.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
===MiniProfiler Statistics===&lt;br /&gt;
The following is the rack-mini-profiler statistics for the page:-&lt;br /&gt;
[[File:tre1.png]]&lt;br /&gt;
&lt;br /&gt;
The box which is seen in the leftmost corner is the MiniProfiler statistics. MiniProfiler gives  a constant notification of how long each page takes to load.The miniprofiler statistics show the time taken to render the view as well as the corresponding SQL calls.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree2.png]]&lt;br /&gt;
&lt;br /&gt;
This image shows the time and the number of SQL calls which are required for each rendering.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree5.png]]&lt;br /&gt;
&lt;br /&gt;
Here as we can see the total number of SQL calls required for children_node_ng is 1123.This is causing the latency in the entire page by 10564.8 ms. This statistics helped us to identify the method which needs to be refactored.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[File:tree6.png]]&lt;br /&gt;
&lt;br /&gt;
The total number of SQL calls required for 2 components here is 2 each.Hence we do not need to refactor this component.&lt;br /&gt;
&lt;br /&gt;
===Identified Component causing the delay===&lt;br /&gt;
tree_display_controller&lt;br /&gt;
&lt;br /&gt;
The following methods are consuming most of the time in this code :-&lt;br /&gt;
&lt;br /&gt;
1)update_fnode_children&lt;br /&gt;
&lt;br /&gt;
2)initialize_fnode_update_children&lt;br /&gt;
&lt;br /&gt;
3)children_node_ng&lt;br /&gt;
&lt;br /&gt;
These methods are from line 172-201 in this controller.&lt;br /&gt;
&lt;br /&gt;
===Solution===&lt;br /&gt;
So here as we can see the time taken to load the page is high due to the time taken for the action :children_node_ng.The time taken to execute it is 10564.8 milliseconds.This is due to the 1123 SQL calls which are performed in the given action .This delay can be reduced by reducing the total number of SQL calls which can be basically reduced by identifying the methods causing this delay as well as by refactoring the code. The solution is to refactor the code which has been attached below to improve the time taken to perform this action.&lt;br /&gt;
&lt;br /&gt;
  def update_fnode_children(fnode, tmp_res)&lt;br /&gt;
&lt;br /&gt;
    # fnode is short for foldernode which is the parent node&lt;br /&gt;
&lt;br /&gt;
      # ch_nodes are childrens&lt;br /&gt;
&lt;br /&gt;
      # cnode = fnode.get_children(&amp;quot;created_at&amp;quot;, &amp;quot;desc&amp;quot;, 2, nil, nil)&lt;br /&gt;
&lt;br /&gt;
      ch_nodes = fnode.get_children(nil, nil, session[:user].id, nil, nil)&lt;br /&gt;
&lt;br /&gt;
      tmp_res[fnode.get_name] = ch_nodes&lt;br /&gt;
&lt;br /&gt;
    end&lt;br /&gt;
&lt;br /&gt;
    # initialize parent node and update child nodes for it&lt;br /&gt;
    def initialize_fnode_update_children(params, node, tmp_res)&lt;br /&gt;
      fnode = (params[:reactParams][:nodeType]).constantize.new&lt;br /&gt;
      node.each do |a|&lt;br /&gt;
        fnode[a[0]] = a[1]&lt;br /&gt;
      end&lt;br /&gt;
      update_fnode_children(fnode, tmp_res)&lt;br /&gt;
    end&lt;br /&gt;
&lt;br /&gt;
    # for child nodes&lt;br /&gt;
    def children_node_ng&lt;br /&gt;
      child_nodes = child_nodes_from_params(params[:reactParams][:child_nodes])&lt;br /&gt;
      tmp_res = {}&lt;br /&gt;
      child_nodes.each do |node|&lt;br /&gt;
        initialize_fnode_update_children(params, node, tmp_res)&lt;br /&gt;
      end&lt;br /&gt;
      res = res_node_for_child(tmp_res)&lt;br /&gt;
      respond_to do |format|&lt;br /&gt;
        format.html { render json: res }&lt;br /&gt;
      end&lt;br /&gt;
    end&lt;/div&gt;</summary>
		<author><name>Krkulkar</name></author>
	</entry>
	<entry>
		<id>https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E1766_Test_team_functionality&amp;diff=110878</id>
		<title>CSC/ECE 517 Fall 2017/E1766 Test team functionality</title>
		<link rel="alternate" type="text/html" href="https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2017/E1766_Test_team_functionality&amp;diff=110878"/>
		<updated>2017-10-28T21:35:16Z</updated>

		<summary type="html">&lt;p&gt;Krkulkar: /* Functional Tests Implementation */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;== Background ==&lt;br /&gt;
Expertiza is a peer review based system which provides incremental learning from the class. This project has been developed together by faculty and students using Ruby on Rails framework. Expertiza allows the instructor to create, edit and delete assignments, create new assignment topics, assign them to a particular class or selected students, have students work on teams and then review each other's assignments at the end. For the students, they can signup for topics, form teams, and submit their projects and assignments. Students then review the work done by other students and give suggestions to improve. Teams after reviews are allotted scores and they can refer to the peer comments to further improve their work. It also supports submission of different file types for assignments, including the URLs and wiki pages.&lt;br /&gt;
&lt;br /&gt;
== Purpose ==&lt;br /&gt;
The purpose of this task is to write functional tests for team functionality. Once an assignment is out, a student can select this assignment and others can join in the team. To test this functionality we wrote functional tests for the various scenarios.&lt;br /&gt;
One such scenario is :&lt;br /&gt;
&lt;br /&gt;
* Once the assignment is out and a student selects it, he/she can send out invites to other students to join the team.&lt;br /&gt;
* Invited students can accept the invitation and join the team.&lt;br /&gt;
&lt;br /&gt;
== Functional Tests ==&lt;br /&gt;
&lt;br /&gt;
Functional tests ensure that the functionalities of a software system are working as expected. To write our functional tests, we used the Capybara gem available for Ruby.&lt;br /&gt;
Capybara gem allows a user to test their web application through simulations.&lt;br /&gt;
&lt;br /&gt;
== Test Plan (Implementation of functional tests) ==&lt;br /&gt;
&lt;br /&gt;
=== Functional Tests for Create group assignment ===&lt;br /&gt;
&lt;br /&gt;
In Expertiza instructor can create public assignment for particular course, define the required rubrics and add students to that assignment.&lt;br /&gt;
&lt;br /&gt;
The following test spec has been written to create public group assignment&lt;br /&gt;
&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
def create_new_assignment&lt;br /&gt;
  login_as(&amp;quot;instructor6&amp;quot;)&lt;br /&gt;
  visit &amp;quot;/assignments/new?private=0&amp;quot;&lt;br /&gt;
&lt;br /&gt;
  fill_in 'assignment_form_assignment_name', with: 'public assignment for test'&lt;br /&gt;
  select('Course 2', from: 'assignment_form_assignment_course_id')&lt;br /&gt;
  fill_in 'assignment_form_assignment_directory_path', with: 'testDirectory'&lt;br /&gt;
  fill_in 'assignment_form_assignment_spec_location', with: 'testLocation'&lt;br /&gt;
  check(&amp;quot;assignment_form_assignment_microtask&amp;quot;)&lt;br /&gt;
  check(&amp;quot;team_assignment&amp;quot;)&lt;br /&gt;
  fill_in 'assignment_form_assignment_max_team_size', with: '3', visible: false&lt;br /&gt;
  check(&amp;quot;assignment_form_assignment_reviews_visible_to_all&amp;quot;)&lt;br /&gt;
  check(&amp;quot;assignment_form_assignment_is_calibrated&amp;quot;)&lt;br /&gt;
  check(&amp;quot;assignment_form_assignment_availability_flag&amp;quot;)&lt;br /&gt;
  expect(page).to have_select(&amp;quot;assignment_form[assignment][reputation_algorithm]&amp;quot;, options: ['--', 'Hamer', 'Lauw'])&lt;br /&gt;
&lt;br /&gt;
  click_button 'Create'&lt;br /&gt;
end&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
Add topics to the assignment&lt;br /&gt;
&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
def add_topic_to_assignment assignment&lt;br /&gt;
  visit &amp;quot;/assignments/#{assignment.id}/edit&amp;quot;&lt;br /&gt;
  click_link 'Topics'&lt;br /&gt;
  click_link 'New topic'&lt;br /&gt;
  fill_in 'topic_topic_identifier', with: '112'&lt;br /&gt;
  fill_in 'topic_topic_name', with: 'test_topic_1'&lt;br /&gt;
  fill_in 'topic_category', with: 'test_topic_1'&lt;br /&gt;
  fill_in 'topic_max_choosers', with: 3&lt;br /&gt;
  click_button 'Create'&lt;br /&gt;
  create(:assignment_due_date)&lt;br /&gt;
  create_list(:participant, 3)&lt;br /&gt;
end&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
=== Functional Tests for Log in as student and selecting a topic of assignment ===&lt;br /&gt;
&lt;br /&gt;
When student login into his Expertiza account, he can check for new assignment under &amp;quot;Assignments&amp;quot; tab and choose the topic of his interest. Student then can send invitation to other students who are also enrolled in same course.&lt;br /&gt;
We have written following test spec to impersonate as a student and select a topic&lt;br /&gt;
&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
it &amp;quot;should impersonate as student&amp;quot; do&lt;br /&gt;
    user = User.find_by(name: &amp;quot;student2064&amp;quot;)&lt;br /&gt;
    stub_current_user(user, user.role.name, user.role)&lt;br /&gt;
    visit '/student_task/list'&lt;br /&gt;
    # Assignment name&lt;br /&gt;
    expect(page).to have_content('public assignment for test')&lt;br /&gt;
    click_link 'public assignment for test'&lt;br /&gt;
    expect(page).to have_content('Submit or Review work for public assignment for test')&lt;br /&gt;
&lt;br /&gt;
    click_link 'Signup sheet'&lt;br /&gt;
    expect(page).to have_content('Signup sheet for public assignment for test assignment')&lt;br /&gt;
    assignment_id = Assignment.first.id&lt;br /&gt;
    visit &amp;quot;/sign_up_sheet/sign_up?id=#{assignment_id}&amp;amp;topic_id=1&amp;quot;&lt;br /&gt;
    expect(page).to have_content('Your topic(s): test_topic_1') &lt;br /&gt;
  end&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
Sending invitations to other students&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
    visit '/student_task/list'&lt;br /&gt;
    click_link 'public assignment for test'&lt;br /&gt;
    click_link 'Your team'&lt;br /&gt;
    expect(page).to have_content('public assignment for test_Team1')&lt;br /&gt;
    fill_in 'user_name', with: 'student2065'&lt;br /&gt;
    click_button 'Invite'&lt;br /&gt;
    fill_in 'user_name', with: 'student2066'&lt;br /&gt;
    click_button 'Invite'&lt;br /&gt;
    expect(page).to have_content('student2065')&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
=== Functional Tests for accepting an invitation ===&lt;br /&gt;
&lt;br /&gt;
In Expertiza assignments, the only way for a student to join an existing team is to be invited by the leader.&lt;br /&gt;
&lt;br /&gt;
Following test spec has been written to accept the invitation to join the team and verify that the assignment topic is assigned to all users&lt;br /&gt;
&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
it &amp;quot;joins the team&amp;quot; do&lt;br /&gt;
    user = User.find_by(name: &amp;quot;student2065&amp;quot;)&lt;br /&gt;
    stub_current_user(user, user.role.name, user.role)&lt;br /&gt;
    visit '/student_task/list'&lt;br /&gt;
    expect(page).to have_content('public assignment for test')&lt;br /&gt;
    visit '/invitation/accept?inv_id=1&amp;amp;student_id=1&amp;amp;team_id=1'&lt;br /&gt;
    visit '/student_teams/view?student_id=1'&lt;br /&gt;
    expect(page).to have_content('Team Information for public assignment for test')&lt;br /&gt;
&lt;br /&gt;
    # to test invalid case - student who is not part of the team does not have created assignment&lt;br /&gt;
    user = User.find_by(name: &amp;quot;student2066&amp;quot;)&lt;br /&gt;
    stub_current_user(user, user.role.name, user.role)&lt;br /&gt;
    visit '/student_task/list'&lt;br /&gt;
    page.should has_no_content?('public assignment for test')&lt;br /&gt;
  end&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
===Functional Tests for whether students choosing the same topic are in the same team===&lt;br /&gt;
&lt;br /&gt;
Since the only way for students to be in a team is by invitation, students who choose the same topic will be in different team. Our test is to let two different students select the same topic and see if their teammates contains each other. Therefore, first we let ‘student2064’ and 'student2065' sign for the same topic, and in their pages, to see if there is 'student2065' or 'student2064'.&lt;br /&gt;
&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
      expect(page).to have_content &amp;quot;Team Name&amp;quot;&lt;br /&gt;
      expect(page).to have_content &amp;quot;student2065&amp;quot;&lt;br /&gt;
      expect(page).to have_content &amp;quot;student2064&amp;quot;&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
== Running the tests ==&lt;br /&gt;
&lt;br /&gt;
The tests can be run on the terminal by navigating to the /spec/features directory using the command:&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
 rspec team_functionalities_spec.rb&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
Whether the test fails or succeeds, allows us to determine which parts of the system are functioning properly.&lt;br /&gt;
&lt;br /&gt;
== Result ==&lt;br /&gt;
&lt;br /&gt;
Coverage increased (+0.3%) to 51.108% when pulling 4915488 on ankit13jain:master into 781e456 on expertiza:master.&lt;br /&gt;
&lt;br /&gt;
== External Links ==&lt;br /&gt;
# link for forked repository [[https://github.com/ankit13jain/expertiza]] &lt;br /&gt;
# Github link for original repository [[https://github.com/expertiza/expertiza.git]]&lt;br /&gt;
# Github link for Capybara [[https://github.com/jnicklas/capybara.git]]&lt;/div&gt;</summary>
		<author><name>Krkulkar</name></author>
	</entry>
</feed>