I am moving an existing html portfolio hosted in githubpages to Blazor, but when the
index.html loads it doesn't load the script libraries on time, but it loads them before the content is shown.
Do you know if there is Scripts section as in ASP.NET MVC, or do you know how I can tell to Blazor
to loads the content synchonously?
Example: The working website is here http://tanyo.takerman.net. The
non working is here http://tanyo-blazor.takerman.net The second one
don't loads the scripts on time, but too late after the html is
loaded.
Disclaimer: You are using a LOT of JS. Blazor keeps an internal render tree - a bit like a shadow dom, but not exactly that. If your JS changes the dom inside the <app> tag, you can expect errors as Blazor won't know about those changes.
To delay Blazor startup (I think that is what you are trying to do) until after your scripts have loaded, you can turn off autostart.
<script autostart="false" src="_framework/blazor.webassembly.js"></script>
And then in some other script that runs at the right time (I don't know how you are going to know what is the right time), you can call window.Blazor.start(); to start the Blazor app.
Related
I have a web component that renders properly when I load the page the first time. However, when I try to render it the second time, it doesn't load at all. What are some good ways to debug lit web components to see why its not loading properly.
What I see in the dom is the following:
<element><div></div></element>
It's missing all the html inside the div.
I am currently developing website, continuing a task handed by my senior.
But since the first time it is handed to me, the website keeps redirecting itself to ad pages. It happens only on the website I develop, not to the others, so the problem is not in the browser.
Is it something in the code? Where specifically do I need to look for it and disable it?
Disabling redirects will arise as a huge problem in the future development. There must be some asynchronous scripts running in the background, with reference to an iframe or redirecting the webpage to some advertisements as follows:
<script async type="text/javascript" src="examplead.js"></script>
Removing scripts like them can solve the issue.
is there is any other way than AJAX/WebSockets to implement partial-page reloads, in node.js applications ?
I was told that template engines with a block/includes functionnality like Jade's do that, but when I open up Chrome DevTools on simple apps built with it, it seems it's still a whole page reload.
Thanks
Jade engine compile template file to minified HTML but included blocks still result to a full HTML page, no partial loading. If you want something more dynamic I guess ajax/ws is best way.
I use WebStorm and it comes with awesome LiveEdit function, and it's totally much better than LiveReload, however it doesn't automatically register changes in all different types of files I'm using. It ignores changes in Stylus and Jade and I need to manually trigger reloading the page anyway.
I guess because LiveEdit doesn't reload entire page, but only relevant parts, and Webstorm of course can't possibly know what needs to be redrawn on the page, when dealing with Jade or Ejs templates
For that matter LiveReload feels to be a better solution.
But I was wondering if it's possible to trigger reloading the page by sending signals to "JetBrains IDE support extension" somehow?
So ideally grunt-task, or gulp-task (I'm using gulp) would watch files for changes and send signals (maybe to WebStorms built-in server) and extension would reload the page. Is that possible?
Can you control Jetbrains built-in server with node?
No. The extension doesn't have the API
However, LiveEdit does normally work for Jade (no hotswap, of course - just page reloading). When Jade is compiled using a file watcher, live reload is correctly triggered. It also works when Jade is compiled with Express. What does your workflow look like? How do you compile Jade, Stylus and other files that aren't natively executed by the browser?
I've created a very simple ASP.NET 4.5 MVC4 web site which uses OpenLayers 2.12. It's got only one page that shows a map with a few points and lines on it. If I run it locally, it runs fine, but after publishing to my Azure Web Site, the OpenLayers' CSS files won't load. I have now added the OpenLayers CSS hard coded in my bundleConfig, and now it works fine. But of course, this is not what I want, because OpenLayers has specific CSS files for other platforms and browser versions etc.
Locally, I just have to include openlayers.js and OpenLayers then adds the right css files. Does anybody know why this doesn't work after publishing to Azure?
From the docs in openlayers.js:
Please remember that when your OpenLayers script is not named
"OpenLayers.js" you will have to make sure that the default theme is
loaded into the page by including an appropriate <link>-tag,
e.g.:
(code)
<link rel="stylesheet" href="/path/to/default/style.css" type="text/css">
(end code)
Because Azure changes the file names that are included, I indeed should be adding the reference to the default style myself. Also, I can just link to style.css, the other css files for e.g. IE6 or Mobile won't be uses automatically, these are just there for yourself to use it when appropriate.