I have a table (Ext.panel.Grid): 21 columns(Ext.grid.column.Column), 50 rows. Hiding with my button 20 columns takes about 2 seconds. I am using column.setVisible(true) method in a loop.
In the browser debugger - ext-all-debug.js, you can see that when you hide each column, a lot of time is spent on:
rootHeaderCt.onHeaderHide(me);
Ext.resumeLayouts(true);
It's in the method hide() in Ext.grid.column.Column.
Is it possible to somehow speed up this process?
Thanks for the advice.
This post solved my problem.
Additionally used Ext.suspendLayouts() before multiple hiding/showing and Ext.resumeLayouts() after.
grid.getView().getHeaderCt().suspendLayouts();
// hide columns
grid.getView().getHeaderCt().resumeLayouts(true);
Fiddle
Related
I have a simple ExpenseShow component that has a child ExpenseForm component.
On ExpenseShow I have a simple update button:
<x-cards. Button
wire:click"$emitTo('expenses. Expense-form', 'editExpense', {{$expense->id}})"
>
Edit Expense
</x-cards. Button>
...
#livewire('expenses.expense-new-form')
The click of the button emits the editExpense event, which opens a modal and the expense is Updated as expected. Then I emit back to $this->emitTo('expenses.expense-show', 'refreshComponent'); from the child component (update method on `ExpenseForm') and it freezes my page (parent component after modal goes away and database is updated.) for a couple of seconds.
However, when I use wire.poll on the ExpenseShow component in the blade everything updates fine with no delay. I just think it's wasteful for this scenario. I don't need the server running requests every 2 seconds, that's why I think refreshComponent is more applicable here. Any ideas? My ExpenseForm has a few dropdowns with hundreds of entries each but wire:poll has no delay and it does it nonstop.
Thanks for any input. Patryk.
Edit:
There was an answer here that made sense. It looks like he deleted his answer. I meant to mark it as Answered when I implemented one of the options. I hope that nice user showa it again. In a nutshell, he suggested I bind my parent and child components via wire: model or that I use livewire: loading or something about livewire: on to replace my on: click and emit... can anyone fill in the gaps? Not sure why their answer was deleted...
Wow. When I wrote this post both Chrome and Edge browsers experienced both issues. Since then, Chrome has been updated and I was able to achieve my desired result per livewire docs ( refresh Component ), shortly after it looks like Microsoft Edge is also working!
I have a ListMultipleChoice which has a Ajax Behavior. When I try to select the list using (Shift + DownArrow), it's not letting me select more than 10 rows. It's just moving up after reaching 10 selections. Whereas, when I select from bottom to top, it's letting me select properly. I know it sounds weird, but that's what this is. Can someone help me with this issue.
Code from comment:
users = new ListMultipleChoice<User>("userList", new PropertyModel<List<User>>( this, "userList"), userModel, new FrUserChoiceRenderer());
Try it on different browsers and see what happens. What does this AjaxEventBehavior do exactly? Does it work without this AjaxEventBehavior? Does it work with a plain html <select> list? What have you tried yourself? Show some code.
When I add a new row kendo ui grid it does not move to next page even I set page number dynamically.
But when there is a javaScrip alert it's working fine.
Has any one faced this issue before. Please suggest me a solution.
Thank you.
The problem is that when you add a new row there are a series of actions that happen in parallel and they are not immediate. If you try to move to the end but the row still is being created, if fails.
When you add an alert, you delay the fact of moving and creation now have time.
If you really need to do it, you can add a timeout (delay) it is not nice/clean but should work.
Do something like:
setTimeout(function() {
grid.page(3);
}, 500);
for introducing half second (500 ms) delay, should be enough.
We had sort of similar issue in IE - onchange fired twice with alert in the event handler. According to what you saying, it sounds like when the alert is NOT in you are getting correct behaviour. Review your code without having the alert in or post a fiddle. Below is an answer from Kendo support in regards to alerts while debugging. Do not use alerts with kendo to stay safe.
Basically this behavior is caused by using "alert" method for debugging purposes - please note that this is not recommended because it can lead to unexpected behavior when interacting with focusing elements. After replacing the "alert" method and with "debbuger" command or "console.log()" function the change event is working as expected - please check this screencast(http://screencast.com/t/7qIAdK6hZ5kD).
Hope it helps.
I am having a performance issue with backbone template.
The situation is I have collection of model, each model have a field called 'isSelected'.
I need to render this collection with a template for each individual model. The 'isSelected' field is used for setting the checkbox in the template.
For the sake of discussion, the template is as following.
<div class='thumbnail'>
<input class='checkbox' type='checkbox' {[ if (isSelected) { ]} checked='checked'{[ } ]}
</div>
When I need to make the checkbox all selected, I will update the field to true for each model in the collection.
The code I used is
this.collection.each(function(e) {
e.set("isSelected", true);
});
However, this way is very slow, for a collection contains 25 items, it will take almost 10 sec to make all checkbox 'checked'.
I am expecting that it should least than 1 sec, if i use plain jquery.
Is there any problems with this approach? what's the best approach for this kind problem?
Why don't you set isSelected to true as default in the model? That way you don't have to loop through the collection to set each of them to true.
It's hard to tell what's taking up all the processing time with the amount of code you posted. My first guess would be the render function is being called multiple times. Creating and destroying templates kills performance. If you hard more code posted it might be easy to spot any problem areas.
You should render all of the HTML nodes that could possibility be need. After they are rendered save a jquery selector and use that to toggle the selected.
Most of the time it isn't JS or Backbone that is the bottleneck. It's that JavaScript is triggering the DOM, CSS or reflows constituently and the browser is doing way too much work.
I'm building a PerfView for for backbone. It can render a collection with 1,000,000 models and scroll at 120FPS on chrome. The code is on Github at: https://github.com/puppybits/BackboneJS-PerfView. There's a lot of optimizations in there and comments in the code. One of the techniques in there is sure to solve your issue.
So i'm implementing a feature where after a user has visited my site, and not signed in and not registered for over two minutes, an alert pops up and asks them to take a survey.
I agree, annoying, but it's a business requirement.
I thought about doing a Session Object, and then in the page_load of the header (since it's on every page) check if the current time is greater than the time in session.
However, this will only fire when the page loads. I kind of need it to pop up at exactly tw minutes.
So I looked into the ASP.NET AJAX timer, which seems to do the trick.
My question is how do you disable it? Because now it just keeps firing every 20 seconds which is what my current interval is.
I thought about maybe setting a cookie and if the cookie isn't present show it, otherwise don't.
Just wondering if anyone else had any insight into this.
Thanks guys!
The problem with the setTimeout() approach as shown by azamsharp is that it only works if the user stays on the same page during the two minutes.
If you have different pages, the you will probably have to implement a solution involving the asp.net session and client-side scripting, e.g:
store a DateTime in the session when the alert must be shown
(on every page) call a page-method from javascript (e.g. every 5 seconds) to check if the alert is due, and show it if it is due
put the javascript part (the call of the pagemethod) into a common master page and use this for each asp.net page
You can use the JavaScript windows.setTimeOut method which will fire exactly once after whatever time is specified.
window.setTimeOut(foo,2000);
The above will call the foo JavaScript function after 2 seconds.
Thanks,