Heat Conduction in a Two-Dimensional Fin (Web Worker)

This page demonstrates solving the 2D heat conduction fin problem using FEAScript in a web worker for improved browser responsiveness. For the mathematical formulation and theory, see the main (standard) tutorial.

⚠️ Important: Due to security restrictions, this example requires launching the browser with reduced security settings, e.g.: 

start chrome --disable-web-security --user-data-dir="C:\tmp\chrome-cors" --disable-site-isolation-trials

These flags disable CORS restrictions which are normally required when working with web workers in a local environment. For production applications, proper CORS headers should be configured on your server.

Web Worker Implementation

The code below shows how to use FEAScript with a web worker. The solution is plotted as a 2D contour. 

<body>
  <!-- ...body region... -->
  <script type="module">
    // Import FEAScript library
    import { FEAScriptWorker, plotSolution, printVersion } from "https://core.feascript.com/src/index.js";
    
    window.addEventListener("DOMContentLoaded", async () => {
      // Print FEAScript version in the console
      printVersion();
  
      // Create a new FEAScriptWorker instance
      const model = new FEAScriptWorker();
  
      // Ensure the worker is ready
      await model.ping();
  
      // Configure model
      await model.setSolverConfig("solidHeatTransferScript");
      await model.setMeshConfig({
        meshDimension: "2D",
        elementOrder: "quadratic",
        numElementsX: 8,
        numElementsY: 4,
        maxX: 4,
        maxY: 2,
      });
  
      // Apply boundary conditions
      await model.addBoundaryCondition("0", ["constantTemp", 200]);
      await model.addBoundaryCondition("1", ["symmetry"]);
      await model.addBoundaryCondition("2", ["convection", 1, 20]);
      await model.addBoundaryCondition("3", ["constantTemp", 200]);
  
      // Solve
      await model.setSolverMethod("lusolve");
      const { solutionVector, nodesCoordinates } = await model.solve();
  
      // Plot results
      plotSolution(
        solutionVector,
        nodesCoordinates,
        "solidHeatTransferScript",
        "2D",
        "contour",
        "solutionPlot"
      );
  
      // Terminate the worker
      model.terminate();
    });
  </script>
  <!-- ...continue of body region... -->
</body>

Results

Below is the 2D contour plot of the computed temperature distribution. This plot is generated in real time using FEAScript. You can find a minimal example of this tutorial in the example directory.

Cannot draw the results. Please turn your phone to horizontal position to see the results. You can find a minimal example of this tutorial in the example directory.
Solving...