Add lazyRendering option

README.md

@@ -116,6 +116,7 @@ ReDoc makes use of the following [vendor extensions](http://swagger.io/specifica
   * **selector**: selector of the element to be used for specifying the offset. The distance from the top of the page to the element's bottom will be used as offset;
   * **function**: A getter function. Must return a number representing the offset (in pixels);
 * `suppress-warnings` - if set, warnings are not rendered at the top of documentation (they still are logged to the console).
+* `lazy-rendering` - if set, enables lazy rendering mode in ReDoc. This mode is useful for APIs with big number of operations (e.g. > 50). In this mode ReDoc shows initial screen ASAP and then renders the rest operations asynchronously while showing progress bar on the top. Check out the [demo](\\rebilly.github.io/ReDoc) for the example.
 * `hide-hostname` - if set, the protocol and hostname is not shown in the method definition.
 
 ## Advanced usage

lib/components/Redoc/redoc.html

@@ -2,7 +2,7 @@
   <h1>Oops... ReDoc failed to render this spec</h1>
   <div class='redoc-error-details'>{{error.message}}</div>
 </div>
-<loading-bar [progress]="loadingProgress"> </loading-bar>
+<loading-bar *ngIf="options.lazyRendering" [progress]="loadingProgress"> </loading-bar>
 <div class="redoc-wrap" *ngIf="specLoaded && !error">
   <div class="background">
     <div class="background-actual"> </div>

lib/components/Redoc/redoc.ts

@@ -62,6 +62,7 @@ export class Redoc extends BaseComponent implements OnInit {
     if (scrollParent === DOM.defaultDoc().body) scrollParent = window;
     optionsMgr.options.$scrollParent = scrollParent;
     this.options = optionsMgr.options;
+    this.lazyTasksService.allSync = !this.options.lazyRendering;
   }
 
   hideLoadingAnimation() {

lib/services/options.service.ts

@@ -8,26 +8,43 @@ const defaults = {
   disableLazySchemas: false
 };
 
-const OPTION_NAMES = new Set(['scrollYOffset', 'disableLazySchemas', 'specUrl', 'suppressWarnings', 'hideHostname']);
+const OPTION_NAMES = new Set([
+  'scrollYOffset',
+  'disableLazySchemas',
+  'specUrl',
+  'suppressWarnings',
+  'hideHostname',
+  'lazyRendering'
+]);
+
+interface Options {
+  scrollYOffset?: any;
+  disableLazySchemas?: boolean;
+  specUrl?: string;
+  suppressWarnings?: boolean;
+  hideHostname?: boolean;
+  lazyRendering?: boolean;
+  $scrollParent?: HTMLElement | Window;
+}
 
 @Injectable()
 export class OptionsService {
-  private _options: any;
+  private _options: Options;
 
   constructor() {
     this._options = defaults;
     this._normalizeOptions();
   }
 
-  get options() {
+  get options():Options {
     return this._options;
   }
 
-  set options(opts) {
+  set options(opts:Options) {
     this._options = Object.assign(this._options, opts);
   }
 
-  parseOptions(el) {
+  parseOptions(el:HTMLElement):void {
     let parsedOpts;
     let attributesMap = DOM.attributeMap(el);
     parsedOpts = {};
@@ -47,7 +64,7 @@ export class OptionsService {
     this._normalizeOptions();
   }
 
-  _normalizeOptions() {
+  _normalizeOptions():void {
     // modify scrollYOffset to always be a function
     if (!isFunction(this._options.scrollYOffset)) {
       if (isFinite(this._options.scrollYOffset)) {
@@ -71,5 +88,6 @@ export class OptionsService {
     if (isString(this._options.disableLazySchemas)) this._options.disableLazySchemas = true;
     if (isString(this._options.suppressWarnings)) this._options.suppressWarnings = true;
     if (isString(this._options.hideHostname)) this._options.hideHostname = true;
+    if (isString(this._options.lazyRendering)) this._options.lazyRendering = true;
   }
 }