CodeIgniter Forums
Debug Toolbar - Printable Version

+- CodeIgniter Forums (https://forum.codeigniter.com)
+-- Forum: CodeIgniter 4 (https://forum.codeigniter.com/forum-28.html)
+--- Forum: CodeIgniter 4 Feature Requests (https://forum.codeigniter.com/forum-29.html)
+--- Thread: Debug Toolbar (/thread-64301.html)

Pages: 1 2


Debug Toolbar - kilishan - 02-04-2016

The other day I was going to start looking at the performance of the current state of CI4 and see if I could identify any simple changes to boost performance here and there, and realized it would be nice to have the profiler in place just to spit out some benchmarking info. So I got sidetracked and started building out a new profiler. I guess I should actually say a new Debug Toolbar.

This is a common item in many frameworks, and I've gotten so used to using Forensic that I thought I'd give it another shot to see what could be made better. After digging around the internet for inspiration, and diving into the code, I ended up with this:

[Image: CI4DebugTimeline.png]

Personally, I like the visual representation of the app's performance, much as you'd see in the developer tools of your browser. Another feature that I really like is that anyone can write a small class and have the information show up in both the timeline and/or as another tab.

What I'm curious about, though - is do you think this is helpful to you, or just frivolous extras?


RE: Debug Toolbar - sv3tli0 - 02-05-2016

Its looking nice. I think that any framework should have such bar.
And I think that it will be good if you make it easy for customisation by developers.

Many times when you make some custom things at your site as using some remote API (for example) its nice if you can add this API requests at the debug bar in a separate tab. This way you can follow any request/answer a lot easier.


RE: Debug Toolbar - Diederik - 02-05-2016

I'm a huge fan of Forensic (so a big thank you for that), I find such toolbars very usefull in development. This look pretty cool and I would love to see it in CI4 itself.
Although I would not mind having to install it manually into my projects because it's not a big deal, I understand the need of a slim and fast framework.


RE: Debug Toolbar - orionstar - 02-05-2016

It's very nice and clean, I like it. Forensics is ugly as hell compared to this. I usually don't care about optimalizations if I see the raw numbers, but the new debug bar does a great job on visualizing exec times.

@kilishan console tab is dead or that will be the next addition? Smile


RE: Debug Toolbar - turtuga - 02-05-2016

amazing Smile


RE: Debug Toolbar - keulu - 02-05-2016

a native debug toolbar is absolutly necessary Smile nice.

Can you log database queries and vars passed to the view too ? (like forensic) i think it's really helpfull


RE: Debug Toolbar - salain - 02-05-2016

Looks great!
+1 for this as a replacement for the profiler


RE: Debug Toolbar - kilishan - 02-05-2016

(02-05-2016, 12:35 AM)sv3tli0 Wrote: Many times when you make some custom things at your site as using some remote API (for example) its nice if you can add this API requests at the debug bar in a separate tab. This way you can follow any request/answer a lot easier.

That's a great use case. I hadn't thought of that one, but figured the customization could come in handy. Great use.

(02-05-2016, 02:46 AM)orionstar Wrote: @kilishan console tab is dead or that will be the next addition? Smile

Undecided. It currently has a tab for the logs, and I'm thinking of making a filter so you can show/hide certain levels of the logs. This should take away the need for Console like in Forensics. We'll see how easy it is to make that work cross-platform.

(02-05-2016, 03:48 AM)keulu Wrote: a native debug toolbar is absolutly necessary Smile nice.

Can you log database queries and vars passed to the view too ? (like forensic) i think it's really helpfull

Database code isn't done, so no toolbar pane built, yet. Smile

Hadn't thought of the view variables, so I'll have to think about how best to show that one. Good point, though.


RE: Debug Toolbar - mwhitney - 02-09-2016

The first thing I did when I loaded up my project this morning was to swap "bottom" with "top" in the #debug-bar entry in toolbar.css (i.e. replace "top: 0;" with "bottom :0;" and "border-bottom: ..." with "border-top: ..."), because it was blocking the top of my test page and there isn't an obvious way to dismiss it. Otherwise, I like it so far. It also makes part of my test page unnecessary, since I was passing an array to the view, then outputting it to verify that I was getting the expected result.


RE: Debug Toolbar - kilishan - 02-09-2016

(02-09-2016, 09:52 AM)mwhitney Wrote: The first thing I did when I loaded up my project this morning was to swap "bottom" with "top" in the #debug-bar entry in toolbar.css (i.e. replace "top: 0;" with "bottom :0;" and "border-bottom: ..." with "border-top: ..."), because it was blocking the top of my test page and there isn't an obvious way to dismiss it. Otherwise, I like it so far. It also makes part of my test page unnecessary, since I was passing an array to the view, then outputting it to verify that I was getting the expected result.

Yeah, it's supposed to be inserting extra space at the top of the page's body to compensate and NOT cover stuff up, but it's not working as expected yet.