Large angular 5.1 project, IE11 hangs at load. Without parse-domain, loads fine.

[subatomicglue]

We have a large-ish angular 5.1 project. When parseDomain is included like this:

// top of .ts component file
let parseDomain = require('parse-domain');
...

// used someplace in a class method:
let domain = parseDomain( this.company.web_addr );
domain = domain ? (domain.domain + '.' + domain.tld).toLocaleLowerCase() : '';

Then IE11 (11.64.16299.0 with update version 11.0.48) will not load our app.
Instead the app sits at the loading spinner we have for it.
No console output, and no breakpoint (Break on Unhandled Exceptions is chosen)

If I comment out this, then IE11 can load our app.
This code is not even run at startup, but on a button click, so I expect it's causing Angular-cli to suck in the parse-domain library

// used someplace in a class method:
let domain;  // = parseDomain( this.company.web_addr );
//domain = domain ? (domain.domain + '.' + domain.tld).toLocaleLowerCase() : '';

Any ideas? Do you know an alternate way to strip a host/subdomain, or to match a tld? (it's not simple, as you no doubt know).
I need to make the following kind of transformation:

www.mydomain.com ==> mydomain.com
host.mydomain.com ==> mydomain.com
host.mydomain.co.uk ==> mydomain.co.uk
host.mydomain.health ==> mydomain.health
... and etc ...
...

---

angular-cli

    _                      _                 ____ _     ___
   / \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|
  / △ \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | |
 / ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | |
/_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___|
               |___/

Angular CLI: 1.6.4
Node: 7.5.0
OS: darwin x64
Angular: 5.1.0
... animations, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, router

@angular/cli: 1.6.4
@angular-devkit/build-optimizer: 0.0.42
@angular-devkit/core: 0.0.28
@angular-devkit/schematics: 0.0.52
@ngtools/json-schema: 1.1.0
@ngtools/webpack: 1.9.4
@schematics/angular: 0.1.17
typescript: 2.5.3
webpack: 3.10.0

package.json has:

"dependencies": {
    "@angular/animations": "5.1.0",
    "@angular/common": "5.1.0",
    "@angular/compiler": "5.1.0",
    "@angular/core": "5.1.0",
    "@angular/forms": "5.1.0",
    "@angular/http": "5.1.0",
    "@angular/platform-browser": "5.1.0",
    "@angular/platform-browser-dynamic": "5.1.0",
    "@angular/router": "5.1.0",
    "@ng-bootstrap/ng-bootstrap": "1.0.0-beta.5",
    "angular2-medium-editor": "1.0.6",
    "angular2-uuid": "1.1.1",
    "blueimp-canvas-to-blob": "3.11.0",
    "bootstrap": "4.0.0-beta",
    "core-js": "2.4.1",
    "intl": "1.2.5",
    "jquery": "3.2.1",
    "lodash": "4.17.4",
    "marked": "0.3.6",
    "medium-editor": "5.23.2",
    "medium-editor-markdown": "2.6.0",
    "moment": "2.18.1",
    "ng-autosize": "1.1.0",
    "ng-click-outside": "2.0.2",
    "ng2-device-detector": "1.0.0",
    "ng2-img-cropper": "0.9.0",
    "ng2-select2": "1.0.0-beta.10",
    "parse-domain": "2.0.0",
    "remove-markdown": "0.1.0",
    "rxjs": "5.5.6",
    "select2": "4.0.3",
    "semaphore": "1.0.5",
    "stacktrace-js": "2.0.0",
    "sweetalert2": "7.0.6",
    "three": "0.86.0",
    "ts-helpers": "1.1.1",
    "web-animations-js": "2.3.1",
    "zone.js": "0.8.19"
  },
  "devDependencies": {
    "@angular-devkit/core": "0.0.28",
    "@angular/cli": "1.6.4",
    "@angular/compiler-cli": "5.1.0",
    "@angular/language-service": "5.1.0",
    "@types/jasmine": "2.8.3",
    "@types/jasminewd2": "2.0.2",
    "@types/lodash": "4.14.83",
    "@types/medium-editor": "5.0.2",
    "@types/mixpanel": "2.13.1",
    "@types/node": "6.0.60",
    "@types/selenium-webdriver": "3.0.8",
    "@types/three": "0.84.29",
    "codelyzer": "4.0.1",
    "dotenv": "4.0.0",
    "http-server": "0.10.0",
    "jasmine-core": "~2.8.0",
    "jasmine-spec-reporter": "~4.2.1",
    "karma": "~2.0.0",
    "karma-chrome-launcher": "~2.2.0",
    "karma-cli": "~1.0.1",
    "karma-coverage-istanbul-reporter": "~1.2.1",
    "karma-env-preprocessor": "~0.1.1",
    "karma-jasmine": "~1.1.0",
    "karma-jasmine-html-reporter": "~0.2.2",
    "karma-phantomjs-launcher": "1.0.0",
    "karma-remap-istanbul": "0.2.1",
    "karma-spec-reporter": "0.0.26",
    "karma-verbose-reporter": "0.0.3",
    "node-sass": "3.13.0",
    "phantomjs-polyfill": "0.0.2",
    "phantomjs-prebuilt": "2.1.7",
    "protractor": "~5.1.2",
    "raw-loader": "0.5.1",
    "sass-loader": "4.0.2",
    "ts-node": "3.2.0",
    "tslint": "5.9.1",
    "typescript": "2.5.3",
    "webdriver-manager": "10.2.5"
  }

polyfills.ts is

/**
 * This file includes polyfills needed by Angular and is loaded before the app.
 * You can add your own extra polyfills to this file.
 *
 * This file is divided into 2 sections:
 *   1. Browser polyfills. These are applied before loading ZoneJS and are sorted by browsers.
 *   2. Application imports. Files imported after ZoneJS that should be loaded before your main
 *      file.
 *
 * The current setup is for so-called "evergreen" browsers; the last versions of browsers that
 * automatically update themselves. This includes Safari >= 10, Chrome >= 55 (including Opera),
 * Edge >= 13 on the desktop, and iOS 10 and Chrome on mobile.
 *
 * Learn more in https://angular.io/docs/ts/latest/guide/browser-support.html
 */

/***************************************************************************************************
 * BROWSER POLYFILLS
 */

/** IE9, IE10 and IE11 requires all of the following polyfills. **/
import 'core-js/es6/symbol';
import 'core-js/es6/object';
import 'core-js/es6/function';
import 'core-js/es6/parse-int';
import 'core-js/es6/parse-float';
import 'core-js/es6/number';
import 'core-js/es6/math';
import 'core-js/es6/string';
import 'core-js/es6/date';
import 'core-js/es6/array';
import 'core-js/es6/regexp';
import 'core-js/es6/map';
import 'core-js/es6/weak-map';
import 'core-js/es6/set';

import 'core-js/es7/array'
//import 'core-js/es7/global'
import 'core-js/es7/string'
import 'core-js/es7/map'
import 'core-js/es7/set'
import 'core-js/es7/error'
import 'core-js/es7/math'
import 'core-js/es7/system'
import 'core-js/es7/symbol'
import 'core-js/es7/reflect'
import 'core-js/es7/observable'

/** IE10 and IE11 requires the following for NgClass support on SVG elements */
// import 'classlist.js';  // Run `npm install --save classlist.js`.

/** IE10 and IE11 requires the following for the Reflect API. */
import 'core-js/es6/reflect';

/** Evergreen browsers require these. **/
// Used for reflect-metadata in JIT. If you use AOT (and only Angular decorators), you can remove.
import 'core-js/es7/reflect';


/**
 * Required to support Web Animations `@angular/platform-browser/animations`.
 * Needed for: All but Chrome, Firefox and Opera. http://caniuse.com/#feat=web-animation
 **/
import 'web-animations-js';  // Run `npm install --save web-animations-js`.



/***************************************************************************************************
 * Zone JS is required by Angular itself.
 */
import 'zone.js/dist/zone';  // Included with Angular CLI.



/***************************************************************************************************
 * APPLICATION IMPORTS
 */

/**
 * Date, currency, decimal and percent pipes.
 * Needed for: All but Chrome, Firefox, Edge, IE11 and Safari 10
 */
import 'intl';  // Run `npm install --save intl`.
/**
 * Need to import at least one locale-data with intl.
 */
import 'intl/locale-data/jsonp/en';

[subatomicglue]

Changing to tldjs npm package fixes the problem for us!
We can now parse the domain (domain + tld) from a hostname (subdomain + domain + tld) once again, and IE11 does not hang/freeze on load of our Angular 5.1 app.

Our common.ts:

const tldjs = require('tldjs');

export class Common {
   static parseDomain( data ) {
    var    a      = document.createElement('a');
           a.href = data;
    let domain = tldjs.getDomain( a.hostname );
    return domain;
  }
}

[faroutchris]

Same issue in a Vue app.

The problem is that parseDomain main function returns an es6 object literal with shorthand syntax.

return {
  tld,
  domain,
  subdomain
}

This is unsupported in es5 and honestly shouldn't be shipped untranspiled.

[jhnns]

The spinner was probably due to parsing issues with large regexes. parse-domain > 2.1.0 uses a trie structure which is smaller and easier to parse.

The ES6 problem should be fixed with v2.1.5.