JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://rawgit.com/pixijs/pixi.js/release/dist/pixi.js"></script>
<canvas id='canvas' width=500 height=500></canvas>

JavaScript

var renderer = new PIXI.autoDetectRenderer(500, 500, {view: document.getElementById('canvas'), backgroundColor: 0x888888, resolution: 1 }, true);
var viewport = new PIXI.Container();

// PanStage
var panStage = new PIXI.Container();
viewport.addChild(panStage);
panStage.interactive = true;

var panStageContainer = new PIXI.Container();
panStage.addChild(panStageContainer);

var background = new PIXI.Graphics();
panStageContainer.addChild(background);
background.clear();
background.beginFill(0x333333);
background.drawRect(0, 0, 300, 100);
background.endFill();

var item1 = new PIXI.Graphics();
panStageContainer.addChild(item1);
item1.clear();
item1.beginFill(0x880022);
item1.drawRect(0, 0, 25, 25);
item1.endFill();
item1.x = 45;
item1.y = 15;
https://jsfiddle.net/4ke8k7hu/1/#run
var item2 = new PIXI.Graphics();
panStageContainer.addChild(item2);
item2.clear();
item2.beginFill(0x229900);
item2.drawRect(0, 0, 25, 25);
item2.endFill();
item2.x = 200;
item2.y = 60;

var mask = new PIXI.Graphics();
//panStage.mask = mask;

// RenderTexture
renderTexture = new PIXI.RenderTexture(renderer, 300, 100);
var fullScreen = new PIXI.Sprite(renderTexture);
viewport.addChild(fullScreen);
fullScreen.y = 150;
fullScreen.x = 50;

var text = new PIXI.Text('Im using RenderTexture for this second box. How can I make this box stay static? Also not sure where the second 2 box is coming from.',
 {
    fontSize: 16,
    wordWrap: true,
    wordWrapWidth: 400,
});

viewport.addChild(text);
text.x = 50;
text.y = 260;


var x = 0;

var animate = function() {
		x++;
    panStage.x = 50 + -x % 100;
    
    mask.beginFill();
		mask.drawRect(50, 0, 100, 100);
		mask.endFill();

    renderer.render(viewport);
    renderTexture.render(panStageContainer);
    requestAnimationFrame(animate);
 };
 
 animate();