I'm still on Windows 10 but I have all Windows 10 updates installed. I have gone through Settings and Repaired/Modified my MS Edge install to latest version, so all that should be good.
My Component code is:
columnSort(colName: string): void {
if (this.sortedAsc) { // sorts in ascending order
this.sortedAsc = false;
this.members =
this.members.sort((m1, m2) => {
return m1[colName].toLowerCase() < m2[colName].toLowerCase() ? -1 :
(m1[colName].toLowerCase() > m2[colName].toLowerCase() ? 1 : 0);
});
} else { // sorts in descending order
this.sortedAsc = true;
this.members =
this.members.sort((m1, m2) => {
return m1[colName].toLowerCase() > m2[colName].toLowerCase() ? -1 :
(m1[colName].toLowerCase() < m2[colName].toLowerCase() ? 1 : 0);
});
}
}
HTML Template Code:
<th class="freezecol3 fixed-header" (click)="columnSort('last_Name')">Last Name ↑↓</th>
<th class="freezecol4 fixed-header" (click)="columnSort('first_Name')">First Name ↑↓</th>
F12 Developer Tools in Edge and Chrome show Request headers like:
sec-ch-ua: "Microsoft Edge";v="131", "Chromium";v="131", "Not_A Brand";v="24"
sec-ch-ua-mobile: ?0
sec-ch-ua-platform: "Windows"
sec-fetch-dest: empty
sec-fetch-mode: cors
sec-fetch-site: same-origin
user-agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/131.0.0.0 Safari/537.36 Edg/131.0.0.0
Edge browser gets "This page isn't responding" message (after 10 to 15 seconds) when column is clicked for sorting. When I click "Wait", the sort takes about 30 seconds in MS Edge. In Chrome & Safari, there is no error condition, and the sort is complete in 2 to 3 seconds.
Updated 01/30/2025: I uninstalled an SQLite DBBrowser app and the sort started working correctly while using MS Edge, but I also queried CoPilot and built a new sort routine as an Angular TypeScript Injectable service, with one public and one private method, to replace the TypeScript default sort() for arrays - like this:
import { Injectable } from "@angular/core";
import { Member } from "../model/member.model";
@Injectable()
export class BinarySortService {
member: Member = new Member();
members: Member[] = new Array<Member>();
constructor() { }
binarySearch(arr: Member[], item: Member, low: number, high: number, comparator: (a: Member, b: Member) => number): number {
if (high <= low) {
return (comparator(item, arr[low]) > 0) ? (low + 1) : low;
}
const mid = Math.floor((low + high) / 2);
if (comparator(item, arr[mid]) === 0) {
return mid + 1;
}
if (comparator(item, arr[mid]) > 0) {
return this.binarySearch(arr, item, mid + 1, high, comparator);
}
return this.binarySearch(arr, item, low, mid - 1, comparator);
}
public binaryInsertionSort(arr: Member[], columnName: string, sortOrder: 'asc' | 'desc'): void {
const comparator = sortOrder === 'asc'
? (a: Member, b: Member) => a[columnName].localeCompare(b[columnName])
: (a: Member, b: Member) => b[columnName].localeCompare(a[columnName]);
for (let i = 1; i < arr.length; i++) {
const key = arr[i];
const position = this.binarySearch(arr, key, 0, i - 1, comparator);
// Shift all elements from the position to the right
let j = i - 1;
while (j >= position) {
arr[j + 1] = arr[j];
j--;
}
arr[j + 1] = key;
}
}
}
The new sort routine is called by the component with this method below which uses the original method name and parameter:
// 2025.01.30: new sorting method, binary-insertion.
columnSort(colName: string): void {
if (this.sortedAsc) {
this.bsrt.binaryInsertionSort(this.members, colName, 'asc');
this.sortedAsc = false;
}
else {
this.bsrt.binaryInsertionSort(this.members, colName, 'desc');
this.sortedAsc = true;
}
}
It's hard to tell if this new binary & insertion sort method works more efficiently or faster than the original, but it does work! Thanks to all who commented and answered.
If you have extensions installed on Microsoft Edge, you can try disabling them for a test. Sometimes extensions can cause hang issues.
Also, you can try toggling a particular setting called Use graphics acceleration when available at edge://settings/system, which has something to do with Edge performance.